@2en/icons
Clawly's standard icon library — one import path, both React Native and Web.
Quick usage
import {IconBubbleQuestion, IconBubbleQuestionFilled} from '@2en/icons'
// Outlined (no suffix)
<IconBubbleQuestion size={24} color="#1d1d1f" />
// Filled
<IconBubbleQuestionFilled size={24} color="#1d1d1f" />
Each icon takes IconProps (re-exported from upstream CentralIconBaseProps):
size?: number | string (default 24), color, style, plus the underlying SVG props.
Naming
Outlined and filled are separate components, not a variant prop — tree-shaking only ships what you import.
| Form | Meaning |
|---|---|
IconArchive | outlined |
IconArchiveFilled | filled |
A handful of glyphs are vendored from @2en/openai-icons instead of central-icons (e.g. IconArchive, IconStop, IconTasks); these don't expose a *Filled variant — mixing the oai outlined with a central filled would clash visually.
Cross-platform
import {IconArchive} from '@2en/icons' works in both React Native (Metro / Expo) and React Web (Webpack / Vite / Next.js). The package's exports field switches by bundler condition:
react-native→@central-icons-react-native/*default→@central-icons-react/*
react-native and react-native-svg are optional peer deps — Web-only consumers see no install warnings.
IconName type
IconName is the intersection of native ∩ web — names guaranteed to exist on every platform. Names exclusive to one platform are still importable, just absent from this union.
Conventions
- No deep imports. Always
import {IconX} from '@2en/icons'. - PascalCase,
Iconprefix. - No
defaultexports. Always named.
License
Re-exported icons under src/central-icons/ are sourced from Iconists Central Icons under our purchased license; the Iconists license terms apply. Vendored glyphs in src/openai-icons/ retain @2en/openai-icons' license. Hand-authored content in src/custom/ is Clawly's.
Working on this package? See CLAUDE.md.