Ivorie
1.5.0 Charts, accent colors and new styles

Angular components you own.

Accessible, signal-based components for Angular 22. Install the package, or copy the source into your app and make it yours.

Get startedOpen the playground
$ npx ivorie init

Live components

Nova, SystemDesigners love packing quirky glyphs into test phrases. This one previews the type.
  • --background
  • --foreground
  • --primary
  • --secondary
  • --muted
  • --accent
  • --border
  • --chart-1
  • --chart-2
  • --chart-3
  • --chart-4
  • --chart-5
BadgeSecondaryOutline
Search anywhere ⌘K
Heading System, body SystemDesigning with rhythm and hierarchy.

A strong body style keeps long text readable and balances the weight of the headings.

Steady spacing and line height let readers scan a paragraph without it feeling dense.

Acme CloudProduction. Last deploy 4 minutes ago.
Deploys today128+12%
Open incidents21 urgent
Schedule a deployInvite by emailNew projectProfile⌘PBilling⌘BSettings⌘SBuildsRunningFinishedFaster image resize

main, started 1 minute ago

Dark mode for settings

preview, started 3 minutes ago

Release checklistShips when every gate is green.
Sign inUse your work email.Members7 people in Acme.
MemberStatusActions
ALAda LovelaceActive
GHGrace HopperActive
ATAlan TuringInvited
Choose a planChange it any time.Order summaryShips in 2 to 4 days.
Desk lamp × 1$64
Linen notebook × 2$36
Total$100
Invite your teamThey get access to this project only.
ALAda Lovelace
GHGrace Hopper
Verify it's youEnter the 6-digit code we sent to your phone.ProfileShown to your team.Maintenance windowPick a day. We notify the team.
November 2026
S M T W T F S
NotificationsWhat we email you about.
Email me
Storage68 GB of 100 GB used.
Spending limitWe pause builds when you reach it.
Monthly limit$120
Your trial ends in 3 days Add a card to keep your projects running. No webhooks yetSend events to your own server when a deploy finishes.Questions

No. Every component runs zoneless, on signals.

Recent deploysThe last changes to production.
ChangeStatus
Faster image resize4f2a91cBuilding
Fix login redirect9b7e0d2Ready
Bump Angular to 22.107d5e44Failed
Browse all 54 components
  • Signals and zonelessSignal inputs and models, OnPush, no zone.js.
  • Server renderingRenders on the server, hydrates without warnings.
  • AccessibleARIA patterns, keyboard support, tested with axe.

A package when you want updates. The source when you want control.

Install the package

Updates come with npm. Import only what you use: every component is its own entry point.

import { IvButton } from '@inlaylab/ivorie/button';

<button ivButton variant="outline">Save</button>
Installation guide

Copy the source

The CLI writes the component files into your app. Read them, change them, keep them.

$ npx ivorie add button

src/app/ui/button/button.ts
src/app/ui/button/public-api.ts
CLI guide