pantoken / design/swatches/src / toSvg

Function: toSvg()

toSvg(swatches, options?): string

Experimental

Render swatches as a grouped SVG specimen sheet.

Parameters

swatches

readonly Swatch[]

The palette (e.g. from toSwatches).

options?

ToSvgOptions = {}

ToSvgOptions.

Returns

string

The SVG document as a string.

Examples

Render a specimen sheet for a README

import { writeFileSync } from "node:fs";
import { swatches, toSvg } from "@pantoken/swatches";

writeFileSync("palette.svg", toSvg(swatches));

Specimen only the core palette, with a title and wider grid

import { swatches, toSvg } from "@pantoken/swatches";

const core = swatches.filter((s) => !s.name.startsWith("primitive-"));
const svg = toSvg(core, { title: "Instructure core colors", columns: 8 });