TOKENAI Design Kit
Skeuomorphism: antarmuka menyerupai benda fisik nyata — tombol glossy yang benar-benar tenggelam saat ditekan, panel logam bersikat dengan sekrup di sudut, input yang dipahat masuk ke permukaan, saklar fisik, lampu LED status yang menyala, kulit berjahit, dan kenop putar. Cahaya selalu datang dari atas: bibir atas terang, bibir bawah gelap, teks ter-emboss. Palet bengkel: linen, aluminium, biru glossy, kulit cokelat, LED amber. Kit satu-tema — terang secara bawaan, tanpa mode gelap. Lihat juga contoh halaman nyata lewat bilah navigasi di atas.
Bitter (heading slab terukir) · PT Sans (body humanis) · IBM Plex Mono (kode & kbd) · skala di bawah adalah seluruh tingkat yang tersedia
Aa — Terukir di pelat logam
Aa — Terukir di pelat logam
Aa — Terukir di pelat logam
Aa — Terukir di pelat logam
Aa — Terukir di pelat logam
Aa — Terukir di pelat logam
Aa — Terukir di pelat logam
Aa — Terukir di pelat logam
Aa — Terukir di pelat logam
#3E6FA6#35608F#9A6A38#E8A33D#E9E5DC#E0DBCE#3B372F#6E6858#B8B09C#4E9A52#C98A2E#C0442F#3E6FA6--tk-space-xs--tk-space-sm--tk-space-md--tk-space-lg--tk-space-xl--tk-space-2xl--tk-space-3xl--tk-radius-sm--tk-radius--tk-radius-lg--tk-radius-fullRadius moderat seperti perangkat fisik — cukup bulat untuk digenggam, cukup tegas untuk dibaut.
--tk-shadow-sm--tk-shadow--tk-shadow-lgCahaya dari atas: bayangan jatuh ke bawah + garis highlight 1px di bibir atas setiap permukaan.
Iconify, set bi (Bootstrap Icons) — tulis <iconify-icon icon="bi:nama">; ratusan ribu ikon lain tersedia dengan set berbeda bila perlu.
Panel kulit berjahit
Utilitas .tk-leather membungkus seksi apa pun dengan kulit cokelat dan jahitan benang.
Semua permukaan adalah material: pelat logam bersekrup (.tk-plate), lampu LED yang benar-benar menyala (.tk-led, varian -amber/-red/-off), kenop putar dengan penunjuk (.tk-knob, varian rotasi -45/-90), dan kulit berjahit (.tk-leather). Tombol tenggelam saat ditekan, tab aktif menonjol dari relnya, dan foto dicetak dalam bingkai putih. Tidak ada mode gelap — benda fisik dilihat di bawah lampu kerja.
Search bar — ikon dan pintasan menyatu di dalam field
Select custom (ditampilkan terbuka) — satu pilihan · dengan pencarian · multi dengan checkbox & aksi. Listbox digambar kit, bukan popup bawaan browser.
Dropdown aksi (ditampilkan terbuka; aslinya terbuka saat trigger diklik)
Semua kontrol digambar sendiri — select, checkbox sumur logam, radio, dan saklar fisik tidak memakai tampilan bawaan browser.
Kartu auth dirakit murni dari komponen form kit — bagian dari paket Komponen. Halaman penuhnya (web & ponsel lewat saklar perangkat) ada di examples/login.html dan examples/register.html.
Selamat datang kembali! Silakan masuk untuk melanjutkan.
Belum punya akun? Daftar gratis
Gratis 14 hari — tanpa kartu kredit.
Sudah punya akun? Masuk
Total Pengguna
12.540
+12,5% dari bulan laluJane Doe
UI/UX Designer
Rel tenggelam dengan tombol preset: tab aktif menonjol keluar sebagai tombol logam.
Setiap badge membawa lampu LED yang menyala sesuai statusnya.
Grid 12 / 3 / 2 kolom pada lebar konten --tk-container
Satu kalimat pendukung yang menjelaskan nilai produk ini bagi penggunanya.
Penjelasan singkat manfaat fitur ini.
Bergabung dengan ribuan pengguna lain.
Advanced filter — pencarian, dua select custom, tombol filter berpenanda jumlah, chip filter aktif
| Nama | Peran | Status | Aksi | |
|---|---|---|---|---|
| Jane Smith | [email protected] | Designer | Aktif | |
| John Doe | [email protected] | Developer | Nonaktif |
|
Kolom Aksi rata kanan: ikon langsung (lihat · edit · hapus) untuk aksi sedikit, atau menu … (klik untuk membuka) bila aksinya banyak.
Chart.js — pustaka chart tunggal untuk semua kit. Warna dibaca dari token kit saat digambar; palet bengkel biru-kulit-amber dengan garis tepi tegas seperti tinta di kertas grafik.
Pengunjung
Pendapatan
Sumber Trafik
Progress bar adalah pengukur analog: rel tenggelam, isi glossy bergaris diagonal.
Belum ada data
Data yang Anda cari belum tersedia di sini.