Orochia UI

@krizaka/orochia-design-system 4.1.0 est le design system de Orochia : la plateforme Krizaka aux couleurs de Orochia. Il surcharge les valeurs des rôles --kz-* — jamais les composants — et ajoute les quelques composants qui portent le vocabulaire du produit, chacun bâti sur une primitive @krizaka/ui.

Comment il étend Krizaka UI

1. @krizaka/tokens/tokens.cssLa plateforme : chaque rôle — surfaces, texte, accent, statuts — avec sa valeur Krizaka, dans les deux modes.
2. @krizaka/tokens/brands/orochia.cssLa marque du produit : la famille d'accent et le dégradé de section de son logo.
3. @krizaka/orochia-design-system/theme.cssLe thème du kit : les valeurs que le produit change par-dessus, et ses propres tokens.

Des composants par-dessus : un composant produit compose des primitives @krizaka/ui (un token, puis une variante, puis un composite) — il n'en copie jamais une.

La palette, les contrastes et les règles produit

Installer

npm install @krizaka/orochia-design-system @krizaka/ui && npm install -D tailwindcss @krizaka/tailwind

@import "tailwindcss";
@import "@krizaka/tailwind";
@import "@krizaka/ui/tailwind.css";
@import "@krizaka/orochia-design-system/theme.css";
@import "@krizaka/tokens/brands/orochia.css";

Ce que le kit ajoute

Chaque composant dit pourquoi Krizaka UI seul ne suffisait pas, et sur quelle primitive il repose.

• Sensual buttonOrochia's signature call to action: the velvet → magenta gradient with the sheen, as a variant of the Krizaka button.Repose sur button
• Social iconA line glyph for the networks a creator links from their profile: Instagram, X, Facebook, TikTok, YouTube, Telegram, a website.
• Status badgeThe state of an auction, a challenge or a drop: a pill with a dot that pulses while something is moving.Repose sur badge

Dépréciés

Conservés pour les apps qui les utilisent encore, chacun avec son remplaçant.

• Live badgeThe 4.0 name of the status badge — same look, the tone live read as active.Repose sur badgeUtiliser à la place : status-badge

Réexportés depuis Krizaka UI

Importés depuis le kit par l'ancien code ; le nouveau code les importe depuis @krizaka/ui.

• Button@krizaka/ui/button
• buttonVariants@krizaka/ui/button
• cn@krizaka/ui/cn
• IconButton@krizaka/ui/button
• KrizakaLogo@krizaka/ui
• MotionObserver@krizaka/ui
• OrochiaLogo@krizaka/ui
• RotatingWord@krizaka/ui

Généré depuis le code de @krizaka/orochia-design-system 4.1.0 : son meta.ts, ses exemples et ses types.