hugo/docs/content/en/functions/images/Overlay.md

title	description	categories	keywords	action	toc
images.Overlay	Returns an image filter that overlays the source image at the given coordinates, relative to the upper left corner.			aliases related returnType signatures functions/images/Filter methods/resource/Filter images.filter images.Overlay RESOURCE X Y	true

Usage

Capture the overlay image as a resource:

{{ $overlay := "" }}
{{ $path := "images/logo.png" }}
{{ with resources.Get $path }}
  {{ $overlay = . }}
{{ else }}
  {{ errorf "Unable to get resource %q" $path }}
{{ end }}

The overlay image can be a global resource, a page resource, or a remote resource.

Create the filter:

{{ $filter := images.Overlay $overlay 20 20 }}

{{% include "functions/images/_common/apply-image-filter.md" %}}

Example

{{< img src="images/examples/zion-national-park.jpg" alt="Zion National Park" filter="Overlay" filterArgs="images/logos/logo-64x64.png,20,20" example=true

}}