Icon

Layer: Primitive / Icon library
Base: lucide-solid (ISC license)

The Icon primitive is the canonical icon component. Pass exactly one of name (curated UI affordance) or kind (document type id; mapped to a Lucide glyph). Stroke width is fixed at 1.6, colour is driven by tone, and there is no drop-shadow — it stays plane-1-safe.

Document kinds

One Lucide glyph per type_id

UI affordances

Curated 16-name set

Tones

accent / default / muted / tertiary / error

Sizes

goal kind at 14 / 16 / 20 / 24 / 32 px

Props

Prop	Type	Default	Description
`name`	`IconName`	—	Curated UI-affordance glyph. Mutually exclusive with `kind`.
`kind`	`IconKind`	—	Document `type_id`. Mutually exclusive with `name`.
`size`	`number`	`16`	Width and height in px.
`tone`	`IconTone`	`"default"`	Maps to `--colors-*` tokens.
`class`	`string`	—	Forwarded to the underlying SVG.

Type-icon map

`kind`	Lucide
`draft`	`NotepadTextDashed`
`diary`	`BookHeart`
`note`	`StickyNote`
`goal`	`Target`
`worklog`	`ClipboardList`
`follow-through`	`ArrowRight`
`idea`	`Lightbulb`
`observation`	`Eye`
`mentee`	`UserStar`
`document`	`FileText`
`decision`	`GitBranch`
`research`	`LibraryBig`

Usage

import { Icon } from "@cypskytech/design-system";

<Icon kind="idea" size={16} tone="accent" />
<Icon name="search" size={20} tone="muted" />