🔧Toolify

Strumenti colore e design gratis — selettori, tavolozze, contrasto, gradienti

Lavoro di colore pratico per il web: selettore colore con HEX/RGB/HSL, generatori di tavolozza e gradienti, verificatore contrasto WCAG per mantenere il testo leggibile, simulazione daltonismo e strumenti ombra CSS. Realizzato per designer e sviluppatori front-end che hanno bisogno del valore esatto e della scelta accessibile, pronto per copiare-incollare.

Convertitore di Colori (HEX, RGB, HSL — istantaneo)

Converti i colori tra HEX, RGB e HSL con un'anteprima live. Modifica qualsiasi campo; gli altri si aggiornano.

Controllo del Contrasto (livelli WCAG AA / AAA)

Verifica il rapporto di contrasto cromatico tra testo e sfondo. Mostra un'anteprima live e badge pass/fail per WCAG AA e AAA con testo normale e grande.

Generatore di gradienti CSS (lineare, radiale, conico)

Crea gradienti CSS visivamente: lineari, radiali e conici. Più punti di colore, controllo dell'angolo, preset. Copia il CSS pronto all'uso.

Generatore di Palette di Colori (5 schemi da un colore base)

Genera palette di colori armoniose da un colore base: complementare, analoga, triadica, tetradica, monocromatica. Clicca su qualsiasi campione per copiare l'hex.

Simulatore di Daltonismo — Vedi i Colori come gli Altri

Inserisci qualsiasi colore esadecimale e visualizza immediatamente come appare a persone con deuteranopia, protanopia, tritanopia e acromatopsia. Indispensabile per il design accessibile.

Generatore CSS Box Shadow (con anteprima in tempo reale)

Crea valori CSS box-shadow visivamente. Regola offset, sfumatura, espansione, colore, opacità e inset. Anteprima in tempo reale, CSS da copiare e incollare.

Cerca nome colore CSS — Colore nominato più vicino dall'hex

Inserisci qualsiasi colore hex per trovare il nome CSS più vicino. Mostra i 5 colori nominati più vicini con valori hex esatti e punteggio di distanza.

Generatore di Sfumature Colore — Stile Tailwind

Genera 11 tinte e sfumature (50–950) per qualsiasi colore, nello stile della scala Tailwind CSS. Clicca su una sfumatura per copiarne il codice hex o esporta tutte come proprietà personalizzate CSS.

Tutti gli strumenti