Một CSS Framework nhỏ nhưng có võ.
Init UI tập trung vào tốc độ phát triển và khả năng tuỳ biến — đổi màu chỉ với 1 dòng CSS, dark mode chuẩn, Toast mạnh mẽ, gradient có sẵn, và tuân thủ độ tương phản ngay từ tầng token.
01 · Tokens
Một biến, cả bảng màu đổi theo
Toàn bộ thang màu 11 sắc độ (50→950) được sinh tự động từ đúng một biến gốc
bằng oklch(from ...). Đè --iu-primary-base là xong — không cần khai báo lại từng shade.
primary (mint)
success / danger / warning / info
Gradient — có sẵn, không cần tự chế
02 · Components
Sẵn dùng ngay
Button
Badge
Alert
Đã lưu thay đổi của bạn.
Bạn đang dùng phiên bản v0.1.0 — API có thể thay đổi.
Không thể kết nối tới máy chủ.
Card
Card thường
Viền mảnh, bo góc lg, đổ bóng nhẹ — nâng lên khi hover.
Card gradient
Nền là gradient token — không tự pha màu tay.
Progress
Tabs
Nội dung tổng quan.
Nội dung cài đặt.
Nội dung bảo mật.
Dropdown
Tooltip · Modal · Offcanvas
Avatar · Switch · Skeleton
Accordion
lang là toàn bộ UI thay đổi ngôn ngữ.Pagination
Button Loading
Spinner
03 · Toast
Toast — thông báo linh hoạt
Gọi InitUI.toast.show(...) — tự xếp chồng, tự đếm giờ, tạm dừng khi hover, có progress bar, hỗ trợ 6 vị trí.
04 · Forms
Form controls
Checkbox & Radio
05 · Extras
Breadcrumbs, List, Table
List
- Zero dependency Vanilla JS, không cần build step
-
Theme tự sinh từ 1 biến gốc
Đổi
--iu-primary-baselà đổi cả bảng màu -
Dark mode có sẵn
data-theme="dark"trên<html>
Scroll To
Table
| Component | Trạng thái | Từ bản |
|---|---|---|
| Nav Dropdown | Ổn định | v0.1.0 |
| Breadcrumbs | Ổn định | v0.1.0 |
| Command Palette | Ổn định | v0.1.0 |