Icon

Thin wrapper around @lucide/angular's dynamic icon lookup — the single way every other tip-* component renders a glyph.

Selector: tip-icon

API

Name	Type	Default	Description
`name` (input, required)	`string`	—	Kebab-case Lucide icon name (e.g. `"triangle-alert"`). Must be registered via `provideLucideIcons(...)` in `app.config.ts`.
`size` (input)	`number \| string`	`18`	Forwarded to the underlying SVG's `size`.
`color` (input)	`string`	`'currentColor'`	Forwarded to the SVG's `color`; pass a token (`var(--tip-red-600)`) or leave as `currentColor` to inherit from text color.

<tip-icon name="shield-alert" [size]="17" color="var(--tip-gold-600)" />

Uses LucideDynamicIcon (selector svg[lucideIcon]) — not <lucide-icon>, which doesn't exist in the installed @lucide/angular v1 package (lucide-angular is deprecated/incompatible with Angular 22).
A name that was never registered in provideLucideIcons(...) renders nothing — check app.config.ts first when a new icon doesn't appear.
No a11y attributes of its own; decorative icons should be marked aria-hidden on a wrapping element by the caller (see auth.html's .auth__visual).