Fills
Choose bands or dither fills, and set pixel size.
Area, bar, radar, and radial charts share fill and pixel on the chart root.
bands
fill="bands" (default on most charts) draws solid crest-to-depth ribbons from each series color.
Bands fillSolid crest-to-depth ribbons.
dither
fill="dither" draws an 8×8 Bayer mesh over an opaque crest-to-depth underpaint. Empty Bayer cells still read as depth. They do not show the chart background through gaps.
AreaSingle-stack melange + water.
pixel
pixel sets cell size in CSS pixels. Default is 2. Values are clamped to at least 1. Larger values look chunkier. Smaller values look denser.
Which fill to use
| Fill | Look | Good for |
|---|---|---|
bands | Solid stepped ribbons | Dense dashboards, print, less visual noise |
dither | Grainy Bayer texture | Marketing UI and pixel-art brand moments |