Icon Reference
Consulte esta subpágina para ver import, available props, exemplo de uso e controles vivos do component.
Icon
Registry-based icon atom backed by the icon files ported from NubbleApp.
Use when: Use when you need a typed, reusable icon from the shared registry instead of embedding raw svg.
Import
import { Icon } from "@components/index";Example
import { Icon } from "@components/index";
<Icon name="search" size={20} color="primary" />Available Props
Registry key such as search, settings, trash or messageRound.
Rendered icon size in pixels.
Primary stroke/fill color when the icon supports it.
Secondary fill color for icons that use an inner fill.
Accessible label when the icon is exposed as an image or button.
Optional click handler that turns the icon into an interactive control.
Live Preview
Current icon: search
Use `name` from the registry and prefer the shared `Icon` atom instead of inline svg.
Files live in `src/components/atoms/Icon/icons`.
Controls
search
settings
trash
checkRound
messageRound
home
chevronRight
size: 16
size: 20
size: 24
size: 32
size: 48
color: text
color: primary
color: sense
color: boost
color: textDanger
fill: white
fill: surface
fill: primarySoft