Bangun lebih cepat dengan UI kit React yang lengkap
82+ komponen yang aksesibel, dapat ditema, dan tree-shakable untuk Web dan React Native — dengan tema langsung, 48 bahasa, dan mode headless Tailwind bawaan.
Ganti tema secara langsung
Tema dikompilasi menjadi variabel CSS --z-* — mengganti satu tema langsung mengubah gaya semua komponen di halaman ini, tanpa biaya re-render. Coba saja:
| # | Status | ||
|---|---|---|---|
| 1042 | Ada Lovelace | Paid | $129.00 |
| 1041 | Grace Hopper | Pending | $89.00 |
| 1040 | Alan Turing | Paid | $249.00 |
| 1039 | Katherine J. | Refunded | $59.00 |
Semua yang dibutuhkan UI produksi
Satu core bebas dependensi, enam paket yang terfokus, tanpa kompromi pada fundamental.
Styling zero-runtime
CSS Modules + CSS custom properties. Tanpa CSS-in-JS, tanpa kalkulasi ulang style saat render.
Aksesibel secara bawaan
Peran WAI-ARIA, dukungan keyboard penuh, dan pengujian axe-core di setiap komponen.
48 bahasa
Semua string bawaan mengalir lewat registri locale. Bahasa dimuat dari luar bundle.
Headless + Tailwind
Aktifkan unstyled secara global atau per komponen dan gunakan class Anda sendiri lewat preset token.
Tree-shakable
JS ESM-first tanpa sideEffects. Sebagian besar komponen di bawah 5KB gzip — ditegakkan di CI.
Web + React Native
API komponen yang sama dan objek tema yang sama menggerakkan @zephora/react dan @zephora/native.
Tulis lebih sedikit, rilis lebih banyak
Controlled atau uncontrolled, bertipe dari ujung ke ujung, terlokalisasi sejak awal. Kode di kiri adalah demo di kanan.
import { Card, CardBody, Rating, Alert } from "@zephora/react";
function Review() {
const [stars, setStars] = React.useState(3);
return (
<Card>
<CardBody>
<Rating value={stars} onValueChange={setStars} />
{stars >= 4 && (
<Alert status="success" title="Thanks!">
We're glad you liked it.
</Alert>
)}
</CardBody>
</Card>
);
}Beri rating 4 bintang atau lebih untuk melihat peringatan muncul.
31 blok salin-tempel
Hero, dasbor, formulir masuk, grid produk — section lengkap yang dibangun dari komponen Zephora. Salin kodenya, tempel, selesai.