Skip to main content

@signapps/icons

A unified <Icon> component backed by Font Awesome (solid, regular, brand) plus a registry of custom SVG icons.

  • Workspace: packages/icons
  • Build: tsup (bundles deps) → dist/

How it works​

Icons are referenced by name, with an optional family prefix:

PrefixFamily
fa: / (none)Font Awesome solid (default)
far:Font Awesome regular
fab:Font Awesome brand
custom:A bundled custom SVG icon

A curated list (faRegistry) names the common icons; any other Font Awesome name resolves dynamically at runtime. The <Icon> component supports size, color, rotation, flip, spin, pulse, and other transform props, rendered with Tamagui styling.

Adding a custom icon​

  1. (Optional) drop the reference SVG into custom_icons/.
  2. Create src/custom-icons/<your-icon>.tsx using registerCustomIcon().
  3. Add the key to src/custom-registry.ts (the type-safe allow-list).
  4. Import it in src/custom-icons/index.ts.
  5. Use <Icon name="custom:yourKey" />.

Exports​

Icon, the prop/name types (IconProps, IconName, FaName, CustomName), the custom-icon API (registerCustomIcon, getCustomIcon, getAllCustomIcons, createCustomIcon), and the customRegistry allow-list.

Consumed by​

@signapps/ui, which re-exports it to all apps.