HexGrid
Honeycomb hexagonal grid pattern
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| colorA | color | #000000 | Cell fill color |
| colorB | color | #ffffff | Grid line color |
| cells | range | 8 | Number of hexagons along the canvas height (the width fits as many as the aspect ratio allows) |
| thickness | range | 1 | Thickness of the hex grid lines |
| rotation | range | 0 | Rotation of the grid in degrees |
| softness | range | 0 | Softness of the line edges (0 = crisp, 1 = very soft) |
| variation | range | 0 | Per-cell random lightening/darkening of the cell fill color |
| colorSpace | "linear" | "oklch" | "oklab" | "hsl" | "hsv" | "lch" | linear | Color space for color interpolation |
Usage
vue
<Shader>
<HexGrid />
</Shader>