Toast Style

Pastel tones, smooth staggered animations, hover focus effects — Inspired by Toast UI Chart.

Configuration

Dataset color palette. Colors cycle automatically when datasets exceed palette length.

Property	Type	Default	Description
`colors`	`string[]`	`["#00a9ff", "#ffb840", ...]`	Color palette for radar datasets

Property	Type	Default	Description
`title.text`	`string`	`""`	Title text
`title.visible`	`boolean`	`true`	Show or hide the title
`title.color`	`string`	`"#333333"`	Text color
`title.fontSize`	`number`	`18`	Font size in px
`title.fontWeight`	`string?`	`"bold"`	Font weight
`title.position`	`"top" \| "bottom"`	`"top"`	Placement relative to chart
`title.alignment`	`"start" \| "center" \| "end"`	`"start"`	Horizontal alignment

Property	Type	Default	Description
`legend.visible`	`boolean`	`true`
`legend.position`	`"top" \| "bottom" \| "right" \| "right-top" \| "right-center" \| "right-bottom"`	`"right-top"`
`legend.gap`	`number`	`12`	Spacing between legend and chart (px)

Chart area padding in pixels.

Property	Type	Default
`padding.top`	`number`	`20`
`padding.right`	`number`	`20`
`padding.bottom`	`number`	`20`
`padding.left`	`number`	`20`

Property	Type	Default	Description
`animation.enabled`	`boolean`	`true`	Enable entry animation
`animation.duration`	`number`	`300`	Animation duration (ms)
`animation.staggerDelay`	`number`	`60`	Delay between datasets (ms)

Radar-specific visual settings.

Property	Type	Default	Description
`radar.fillOpacity`	`number`	`0.3`	Fill opacity of radar areas (0-1)
`radar.strokeWidth`	`number`	`2`	Stroke width of radar outlines (px)
`radar.gridColor`	`string`	`"rgba(0, 0, 0, 0.1)"`	Grid line color
`radar.gridWidth`	`number`	`1`	Grid line width (px)
`radar.axisColor`	`string`	`"rgba(0, 0, 0, 0.1)"`	Axis line color
`radar.axisWidth`	`number`	`1`	Axis line width (px)
`radar.labelMargin`	`number`	`24`	Margin around radar for axis labels (px)