Color.Gamut.SVG (Color v0.11.0)

Copy Markdown

Renders a chromaticity diagram — the horseshoe, gamut triangles, Planckian locus, and optional palette / seed overlays — as a self-contained SVG string.

The heavy lifting (spectral-locus points, working-space triangle vertices, Planckian coordinates) is done by Color.Gamut.Diagram; this module wraps that data in a complete, styleable SVG.

Useful when you want to embed a chromaticity diagram in a design-system docs page, a README, an exported PDF, or any tool that speaks SVG. The same renderer is used by the /gamut tab of Color.Palette.Visualizer.

Example

iex> svg = Color.Gamut.SVG.render(projection: :uv, gamuts: [:SRGB, :P3_D65])
iex> String.starts_with?(svg, "<svg viewBox=")
true

Summary

Functions

render(options \\ [])

Renders the diagram as an SVG binary.

Functions

render(options \\ [])

@spec render(keyword()) :: binary()

Renders the diagram as an SVG binary.

Options

  • :projection is :uv (default) or :xy.

  • :gamuts is a list of working-space atoms to overlay as triangles. Default [:SRGB, :P3_D65]. Pass [] to render no triangles.

  • :planckian — when true (default false), draws the Planckian locus from 1500 K to 20 000 K with annotation points at 2000, 2700, 4000, 6500, and 10 000 K.

  • :seed — any Color.input(). When provided, a labelled dot is plotted at the colour's chromaticity.

  • :palette — a Color.Palette.Tonal or Color.Palette.ContrastScale struct. When provided, every stop is plotted as a coloured circle with a <title> giving its label and hex. The seed stop is drawn slightly larger.

  • :width, :height — SVG viewport dimensions. Defaults 800 × 700. The inline CSS of the embedding page can scale this with width: 100%.

  • :gamut_colours — a map of working_space_atom => hex overriding the default outline colour for specific spaces.

Returns

  • A binary containing a self-contained <svg>…</svg> element.

Examples

iex> svg = Color.Gamut.SVG.render(projection: :xy)
iex> String.contains?(svg, "Chromaticity not shown directly") or String.contains?(svg, "polygon")
true

iex> palette = Color.Palette.Tonal.new("#3b82f6")
iex> svg = Color.Gamut.SVG.render(palette: palette, seed: "#3b82f6")
iex> String.contains?(svg, "<title>500:")
true