Web uniquement — React, depuis @krizaka/ui/landing-page. Bêta : son API peut encore changer à une version mineure.

Installation

Installer

npm install @krizaka/ui @krizaka/tailwind @krizaka/tokens tailwindcss

Styles

@import "tailwindcss";
@import "@krizaka/tailwind";
@import "@krizaka/ui/tailwind.css";

Importer

import { LandingPage } from "@krizaka/ui/landing-page";

Exemples

Props

Accessibilité

• The hero's title is the page's h1; the window is a figure, its bar decorative.
• Proofs are a description list; the bento a list of features.

Bonnes pratiques

• One lg feature in the bento: the one the visitor came for.
• The window shows the real product (a recording, a demo), never a mock-up.
• Three or four proofs, each a fact that can be checked.
• Words and content arrive as props; the motion is the platform's ([data-reveal], still under reduced motion).

Composants liés

• Product pageA product's overview in its brand: split hero with facts and the product alive, the traps it removes as compact argument cards, its decisions with their cost, the promise a bird keeps, the closing call.
• Page heroThe first screen of a page: the way back, an eyebrow, the h1, a lead, what follows them (facts, actions) and an aside (the page's bird) — on the brand's backdrop, painted at once.
• Card gridA responsive grid of cards: as many columns as the width allows (one on a phone), the cells of a row at one height, a staggered reveal and the light that follows the pointer.

Générée depuis le code de @krizaka/ui 2.10.0 : son meta.ts, ses exemples et ses types.Modifier cette documentation sur GitHub