Layer Icon Attribute¶

class Icon¶

When combining these attributes, the image is colorized by the specified color.

Hint

If no color is specified, then the image‘s original color is shown.

my-layout.yml¶

layers:
  - background: { color: "#4051B5" }
  - size: { width: 150, height: 150 }
    offset: { x: 525, y: 240 }
    icon:
      image: sphinx_logo
      color: "white"

image : str | None¶

An image file’s path. This path can be absolute or relative to one of the paths specified in social_cards.image_paths.

By default, this image will be resized to fit within the layer’s size. See preserve_aspect for more details on resizing images.

Missing file extensions

If the image file’s name does not include a file extension (eg .png), then it is assumed to ba a SVG image (.svg is appended to the filename).

Note

If no color is specified, then the image’s original color will be shown. For SVG images without hard-coded color information, black will be used.

my-layout.yml¶

layers:
  - background: { color: "#4051B5" }
  - size: { width: 150, height: 150 }
    offset: { x: 525, y: 240 }
    icon:
      image: sphinx_logo.svg

color : Color | Linear_Gradient | Radial_Gradient | Conical_Gradient | None¶

The color used as the fill color. The actual image color is not used when specifying this, rather the non-transparent data is used as a mask for this value.

Seealso

Please review Choosing a color section for more detail.

Hint

If an alpha transparency is included with the specified color, then the image will become transparent as well.

my-layout.yml¶

layers:
  - background: { color: "#4051B5" }
  - size: { width: 150, height: 150 }
    offset: { x: 525, y: 240 }
    icon:
      image: sphinx_logo.svg
      color: "#0000003F"

preserve_aspect : bool | Literal['width', 'height']¶

If an image is used that doesn’t match the layer’s size, then the image will be resized accordingly. This option can be used to control which horizontal width or vertical height or both (true) constraints are respected. Set this option to false to disable resizing the image. By default, this option is set to true.

If the image has to be resized then it is centered on the layer for which it is used.