Aller au contenu principal

    Utilitzem galetes

    Utilitzem galetes per millorar la teva experiència.

    Saber-ne més a la nostra Galetes i Privadesa

    Tema shadcn/ui

    Genera configuracions de tema per a shadcn/ui. Utilitza Tema shadcn/ui gratis en línia, sense registre, amb resultats ràpids i processament segur al navegador.

    Base

    Primary

    Secondary

    Muted & Accent

    Destructive

    Borders & Input

    Vista prèvia

    Vista prèvia dels components

    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 t’ajuda a treballar amb colors directament al navegador.

    L’eina està pensada per a dissenyadors, desenvolupadors i creadors que necessiten resultats ràpids i fiables.

    Supported formats

    CSS
    Tailwind
    HSL
    shadcn/ui

    How it works

    1

    Step 1

    Obre Tema shadcn/ui

    2

    Step 2

    Introdueix o importa els colors

    3

    Step 3

    Copia, exporta o reutilitza el resultat

    Errors comuns a evitar

    • Oblidar comprovar el contrast pot perjudicar la llegibilitat.
    • Fer servir massa colors pot dificultar l’ús de la paleta.

    Consells pro

    • Desa els colors principals com a variables CSS.
    • Prova la paleta en mode clar i fosc abans de publicar.

    Privacy guaranteed: everything is processed locally in your browser.

    El processament es fa localment al navegador sempre que és possible. No cal cap compte.

    Tema shadcn/ui per als teus projectes de color

    Genera configuracions de tema per a shadcn/ui.

    Tema shadcn/ui sense pèrdua de precisió

    Les conversions s'executen amb valors exactes (HEX, RGB, HSL, OKLCH). Sense aproximació visual: obtens el color fidel a la teva intenció de disseny.

    Tema shadcn/ui gratis en línia

    Sense registre, sense baixar programari. Tema shadcn/ui és 100% gratuït i funciona a qualsevol navegador. El pla gratuït inclou 10 usos al dia.

    Tema shadcn/ui ràpid i segur

    El processament es fa directament al navegador per a màxima velocitat. No s'envia cap dada als nostres servidors: els teus colors són privats.

    Tema shadcn/ui per compartir i col·laborar

    Exporta resultats com HEX, RGB, HSL, CSS, JSON o copia'ls amb un clic. Ideal per compartir guia de color amb el teu equip.

    Descobreix totes les nostres eines de color

    Extreu, converteix, genera paletes, degradats i contrastos WCAG en pocs clics.

    Veure totes les eines

    Related tools

    Paleta Tailwind
    Variables CSS
    Vista prèvia UI
    Contrast de colors

    Guies i tutorials

    Aprèn a utilitzar les nostres eines amb les nostres guies detallades.

    shadcn-theme: guia pràctica de developer

    Guia localitzada per utilitzar shadcn-theme, entendre bones pràctiques de developer i evitar errors comuns.

    shadcn-theme: guia pràctica de developer

    Guia localitzada per utilitzar shadcn-theme, entendre bones pràctiques de developer i evitar errors comuns.

    shadcn-theme: guia pràctica de developer

    Guia localitzada per utilitzar shadcn-theme, entendre bones pràctiques de developer i evitar errors comuns.

    Frequently asked questions

    Sí, l’eina està disponible gratis en línia.

    El processament es fa al navegador sempre que és possible per protegir les dades.