Aller au contenu principal

    Kami menggunakan cookie

    Kami menggunakan cookie untuk meningkatkan pengalaman Anda.

    Pelajari lebih lanjut di Cookie dan Privasi

    Tema shadcn/ui

    Buat konfigurasi tema untuk shadcn/ui. Gunakan Tema shadcn/ui online gratis tanpa daftar, dengan hasil cepat dan pemrosesan aman di browser.

    Base

    Primary

    Secondary

    Muted & Accent

    Destructive

    Borders & Input

    Pratinjau

    Pratinjau komponen

    Card content

    Muted text example

    @layer base {
  :root {
    --background: 0 0% 100%;
    --foreground: 0 0% 4%;
    --card: 0 0% 100%;
    --card-foreground: 0 0% 4%;
    --popover: 0 0% 100%;
    --popover-foreground: 0 0% 4%;
    --primary: 0 0% 9%;
    --primary-foreground: 0 0% 98%;
    --secondary: 0 0% 96%;
    --secondary-foreground: 0 0% 9%;
    --muted: 0 0% 96%;
    --muted-foreground: 0 0% 45%;
    --accent: 0 0% 96%;
    --accent-foreground: 0 0% 9%;
    --destructive: 0 84% 60%;
    --destructive-foreground: 0 0% 98%;
    --border: 0 0% 90%;
    --input: 0 0% 90%;
    --ring: 0 0% 9%;
    --radius: 0.5rem;
  }
}

    Tema shadcn/ui membantu Anda bekerja dengan warna langsung di browser.

    Alat ini dibuat untuk desainer, developer, dan kreator yang membutuhkan hasil cepat dan andal.

    Supported formats

    CSS
    Tailwind
    HSL
    shadcn/ui

    How it works

    1

    Step 1

    Buka Tema shadcn/ui

    2

    Step 2

    Masukkan atau impor warna

    3

    Step 3

    Salin, ekspor, atau gunakan kembali hasilnya

    Kesalahan umum yang harus dihindari

    • Tidak memeriksa kontras dapat mengurangi keterbacaan.
    • Terlalu banyak warna dapat membuat palet sulit diterapkan.

    Tips pro

    • Simpan warna utama sebagai variabel CSS.
    • Uji palet dalam mode terang dan gelap sebelum dipublikasikan.

    Privacy guaranteed: everything is processed locally in your browser.

    Jika memungkinkan, pemrosesan dilakukan secara lokal di browser. Tidak perlu akun.

    Tema shadcn/ui untuk proyek warna Anda

    Buat konfigurasi tema untuk shadcn/ui.

    Tema shadcn/ui tanpa kehilangan presisi

    Konversi berjalan pada nilai tepat (HEX, RGB, HSL, OKLCH). Tanpa pendekatan visual — Anda mendapatkan warna yang setia pada niat desain.

    Tema shadcn/ui gratis online

    Tanpa pendaftaran, tanpa unduh perangkat lunak. Tema shadcn/ui 100% gratis dan bekerja di browser apa pun. Paket gratis mencakup 10 kali penggunaan per hari.

    Tema shadcn/ui cepat dan aman

    Pemrosesan terjadi langsung di browser untuk kecepatan maksimum. Tidak ada data yang dikirim ke server kami — warna Anda tetap privat.

    Tema shadcn/ui untuk berbagi dan kolaborasi

    Ekspor hasil sebagai HEX, RGB, HSL, CSS, JSON atau salin dengan satu klik. Sempurna untuk berbagi panduan warna dengan tim.

    Temukan semua alat warna kami

    Ekstrak, konversi, buat palet, gradien, dan kontras WCAG hanya dengan beberapa klik.

    Lihat semua alat

    Related tools

    Palet Tailwind
    Variabel CSS
    Pratinjau UI
    Kontras Warna

    Panduan dan tutorial

    Pelajari cara menggunakan alat kami dengan panduan terperinci.

    shadcn-theme: panduan praktis developer

    Panduan lokal untuk menggunakan shadcn-theme, memahami praktik terbaik developer, dan menghindari kesalahan umum.

    shadcn-theme: panduan praktis developer

    Panduan lokal untuk menggunakan shadcn-theme, memahami praktik terbaik developer, dan menghindari kesalahan umum.

    shadcn-theme: panduan praktis developer

    Panduan lokal untuk menggunakan shadcn-theme, memahami praktik terbaik developer, dan menghindari kesalahan umum.

    Frequently asked questions

    Ya, alat ini tersedia online secara gratis.

    Jika memungkinkan, pemrosesan dilakukan di browser untuk melindungi data Anda.