JSON.FORMATSuite completa per formattare, convalidare, minificare, confrontare e convertire JSON.//REGEX.TESTERTester di espressioni regolari in tempo reale con spiegazioni e sostituzione.//PDF.SUITEUnisci, dividi, estrai testo, ruota e converti pagine PDF in immagini.//IMAGE.STUDIOEditor di foto nel browser: ritaglio, filtri, WebP/PNG e codifica Base64.//HTML.BEAUTIFYFormattatore di codice HTML, minificatore e codificatore di entità.//CSS.MINIFYFormattatore di CSS, minificatore di produzione e convertitore CSS in SCSS.//SQL.FORMATTERFormattatore di query SQL, traduttore tra dialetti e minificatore.//SVG.EXCALIDRAWEditor visuale vettoriale interattivo con Excalidraw e formattatore SVG.//TEXT.DIFFContatore di parole, stima del tempo di lettura e comparatore diff.//YAML.CONVERTValidatore e formattatore bidirezionale YAML e JSON con controllo sintattico.//XML.PARSERFormattatore di documenti XML, ispettore ad albero e convertitore in JSON.//GRAPHQL.STUDIOFormattatore di query e schemi SDL, minificatore e ordinamento campi AST.//BASE64.CODECCodificatore e decodificatore Base64 e URL-Safe con supporto UTF-8.//LOREM.IPSUMGeneratore di testo segnaposto per mockup, prototipi e test UI.//PASSWORD.GENGeneratore di password sicure e casuali con misuratore di entropia.//URL.STUDIOSuite di 8 strumenti: encode, decode, validatore, parser e costruttore.//QR.STUDIOGeneratore di codici QR personalizzati con logo, colori e sfumature.//ASCII.EXPLORERTabella interattiva ASCII 0-255, scorciatoie Alt e simboli CP437.//KEYCODES.LIVERilevatore in tempo reale di KeyboardEvent e tabella codici JavaScript.//JWT.DEBUGGERDecodificatore di token JWT, ispezione claims e verifica firma con Web Crypto.//BINARY.CODECConvertitore bidirezionale da testo a binario con pioggia Matrix e tabella ASCII.//CHARTS.STUDIOGeneratore di grafici interattivi (barre, linee, torta) da dati CSV.//UUID.V7Generatore massivo di UUID v4, v7 ordinato nel tempo, v1 e validatore.//CSV.JSONConvertitore bidirezionale da CSV a JSON con delimitatori e visualizzazione tabellare.//COLORS.STUDIOConvertitore HEX/RGB/HSL/CMYK, armonie di colori e test contrasto WCAG.//SEO.METAGeneratore di Meta Tag, Open Graph e anteprima dal vivo di Google SERP.//SCHEMA.JSONLDGeneratore di dati strutturati Schema.org JSON-LD per Google Rich Snippets.//SITEMAP.XMLGeneratore di sitemap XML standard (Protocollo 0.9) per Google e Bing.//ROBOTS.TXTGeneratore di robots.txt, blocco bot di IA e test delle regole URL.//FAKE.DATAGeneratore di dati fittizi e sintetici: esporta in JSON, CSV, SQL e TypeScript.//CLOCK.WORLDOrologio mondiale in tempo reale con globo 3D olografico e fusi orari IANA.//DATE.CALCGiorni tra date, età esatta, giorni lavorativi, timestamp Unix e parser cron.//CALC.SUITESuite di 56+ calcolatrici: percentuali, mutui, prestiti, IVA, BMI e stipendi.//JSON.FORMATSuite completa per formattare, convalidare, minificare, confrontare e convertire JSON.//REGEX.TESTERTester di espressioni regolari in tempo reale con spiegazioni e sostituzione.//PDF.SUITEUnisci, dividi, estrai testo, ruota e converti pagine PDF in immagini.//IMAGE.STUDIOEditor di foto nel browser: ritaglio, filtri, WebP/PNG e codifica Base64.//HTML.BEAUTIFYFormattatore di codice HTML, minificatore e codificatore di entità.//CSS.MINIFYFormattatore di CSS, minificatore di produzione e convertitore CSS in SCSS.//SQL.FORMATTERFormattatore di query SQL, traduttore tra dialetti e minificatore.//SVG.EXCALIDRAWEditor visuale vettoriale interattivo con Excalidraw e formattatore SVG.//TEXT.DIFFContatore di parole, stima del tempo di lettura e comparatore diff.//YAML.CONVERTValidatore e formattatore bidirezionale YAML e JSON con controllo sintattico.//XML.PARSERFormattatore di documenti XML, ispettore ad albero e convertitore in JSON.//GRAPHQL.STUDIOFormattatore di query e schemi SDL, minificatore e ordinamento campi AST.//BASE64.CODECCodificatore e decodificatore Base64 e URL-Safe con supporto UTF-8.//LOREM.IPSUMGeneratore di testo segnaposto per mockup, prototipi e test UI.//PASSWORD.GENGeneratore di password sicure e casuali con misuratore di entropia.//URL.STUDIOSuite di 8 strumenti: encode, decode, validatore, parser e costruttore.//QR.STUDIOGeneratore di codici QR personalizzati con logo, colori e sfumature.//ASCII.EXPLORERTabella interattiva ASCII 0-255, scorciatoie Alt e simboli CP437.//KEYCODES.LIVERilevatore in tempo reale di KeyboardEvent e tabella codici JavaScript.//JWT.DEBUGGERDecodificatore di token JWT, ispezione claims e verifica firma con Web Crypto.//BINARY.CODECConvertitore bidirezionale da testo a binario con pioggia Matrix e tabella ASCII.//CHARTS.STUDIOGeneratore di grafici interattivi (barre, linee, torta) da dati CSV.//UUID.V7Generatore massivo di UUID v4, v7 ordinato nel tempo, v1 e validatore.//CSV.JSONConvertitore bidirezionale da CSV a JSON con delimitatori e visualizzazione tabellare.//COLORS.STUDIOConvertitore HEX/RGB/HSL/CMYK, armonie di colori e test contrasto WCAG.//SEO.METAGeneratore di Meta Tag, Open Graph e anteprima dal vivo di Google SERP.//SCHEMA.JSONLDGeneratore di dati strutturati Schema.org JSON-LD per Google Rich Snippets.//SITEMAP.XMLGeneratore di sitemap XML standard (Protocollo 0.9) per Google e Bing.//ROBOTS.TXTGeneratore di robots.txt, blocco bot di IA e test delle regole URL.//FAKE.DATAGeneratore di dati fittizi e sintetici: esporta in JSON, CSV, SQL e TypeScript.//CLOCK.WORLDOrologio mondiale in tempo reale con globo 3D olografico e fusi orari IANA.//DATE.CALCGiorni tra date, età esatta, giorni lavorativi, timestamp Unix e parser cron.//CALC.SUITESuite di 56+ calcolatrici: percentuali, mutui, prestiti, IVA, BMI e stipendi.//

MODULO 05 · DESIGN & PALETTE

Color Studio & Armonie

Studio colore con conversione HEX, RGB, HSL, CMYK, validatore contrasto WCAG 2.1 e armonie cromatiche.

SELEZIONA COLORE

Alpha: 100%

PRESET CYBERPUNK:

HEX#00F6FF

RGBrgb(0, 246, 255)

RGBArgba(0, 246, 255, 1)

HSLhsl(182, 100%, 50%)

HSLAhsla(182, 100%, 50%, 1)

CMYKcmyk(100%, 4%, 0%, 0%)

ARMONIE CROMATICHE

COMPLEMENTARE (180°)

ANALOGHI (±30°)

TRIADICA (120°)

TETRADICA (90°)

SCALA DI LUMINOSITÀ (15% - 90%)

VALIDATORE CONTRASTO WCAG 2.1

SU SFONDO BIANCO (#FFFFFF)

1.34:1

Aa Text Preview Sample

AA Normal FAILAAA Normal FAIL

SU SFONDO SCURO (#0E0C1A)

14.39:1

Aa Text Preview Sample

AA Normal PASSAAA Normal PASS

Guida Completa: Spazi di Colore e Accessibilità Web

1. Cosa sono gli spazi di colore?

RGB/HEX per schermi digitali, HSL per l’occhio umano e CMYK per la stampa.

2. Standard WCAG 2.1 e Contrasto

Contrasto minimo richiesto: 4.5:1 per testo normale (AA) e 7:1 (AAA).

3. Armonie di Colore

Relazioni geometriche sulla ruota cromatica per palette bilanciate.

4. CSS Moderno: OKLCH e color-mix()

OKLCH corregge le deviazioni di luminosità di HSL nei gradienti.

Domande Frequenti (FAQs)

Perché usare HSL nei CSS?

Facilita la gestione dei temi scuri e chiari modificando solo la luminosità.

Come si calcola il contrasto?

Rapporto di luminanza relativa (L1 + 0.05) / (L2 + 0.05) secondo il W3C.

STRUMENTI DI DESIGN CORRELATI:

CSS Formatter & Minifier →SVG Studio & Excalidraw →Image Editor & Converter →