Atsitiktinių spalvų generatorius
Generuok atsitiktines spalvas ar darnias paletes, užfiksuok patinkančias, kopijuok HEX, RGB ar HSL kodus ir eksportuok kaip CSS, SCSS, JSON ar Tailwind.
Užfiksuok spalvas, kurios patinka, tada generuok iš naujo, kad būtų pakeistos tik kitos.
Spalvos
Kaip naudotis atsitiktinių spalvų generatoriumi
- Nustatyk Spalvų skaičius (nuo 1 iki 20).
- Pasirink Režimas: - Atsitiktinai intervale kiekvieną spalvą traukia nepriklausomai. Susiaurink Atspalvis (°), Sodrumas (%) ir Šviesumas (%) intervalus laukais „nuo“ ir „iki“, kad liktum vienoje spalvų šeimoje, pavyzdžiui, tik pastelinės ar tik mėlynos. - Darni paletė (OKLCH) ištraukia vieną atsitiktinę bazinę spalvą ir sukuria kitas pagal spalvų darną. Pasirink Darna (Papildomosios, Analogiškos, Triada, Skaidytos papildomosios, Tetrada, Kvadratas, Monochrominė) arba palik Nustebink mane, kad kaskart gautum kitą darną.
- Spustelėk Generuoti spalvas. Kiekviena kortelė rodo spalvą su jos HEX, RGB ir HSL kodais; mažieji mygtukai HEX, RGB ir HSL nukopijuoja atitinkamą kodą.
- Spustelėk Užfiksuoti ant spalvų, kurias nori palikti, tada vėl Generuoti spalvas: pasikeis tik neužfiksuotos spalvos. Spustelėk mygtuką dar kartą, kad atrakintum spalvą.
- Pasirink formatą Eksportuoti kaip (HEX sąrašas, CSS kintamieji, SCSS kintamieji, JSON masyvas ar Tailwind spalvos) ir naudok Kopijuoti arba Atsisiųsti, kad pasiimtum visą rinkinį.
Kaip parenkamos spalvos
Režimu Atsitiktinai intervale atspalvis, sodrumas ir šviesumas traukiami tolygiai tavo nustatytuose intervaluose, tada HSL paverčiamas RGB ta pačia formule, kurią naršyklės naudoja hsl(). Atspalvio intervalas gali apimti raudoną: nuo 330 iki 30 duoda rožines, raudonas ir oranžines spalvas, einant per 0°. Keli naudingi nustatymai:
- Pastelinės: sodrumas 40–80 %, šviesumas 75–90 %.
- Tamsūs, prislopinti tonai: sodrumas 10–40 %, šviesumas 15–35 %.
- Tik mėlynos: atspalvis 190–250.
- Šiltos spalvos: atspalvis nuo 330 iki 60.
Režimu Darni paletė (OKLCH) įrankis dirba OKLCH, suvokimu pagrįstame spalvų modelyje, kuriame vienodi šviesumo žingsniai akiai atrodo vienodi. Kaip bazė naudojama pirma užfiksuota spalva; jei nieko neužfiksuota, ištraukiama atsitiktinė vidutinio šviesumo, gana sodri bazė. Kitos spalvos ima darnos atspalvio kampus (pavyzdžiui, +120° ir +240° triadai) su nedideliu atsitiktiniu atspalvio, šviesumo ir chromos nukrypimu, kad kiekvienas spustelėjimas duotų naują rezultatą. Kai prašai daugiau spalvų, nei turi darna atspalvių, papildomos spalvos pakartoja kampus šviesesniais ir tamsesniais variantais. Monochrominė išlaiko vieną atspalvį ir paskirsto šviesumą nuo tamsaus iki šviesaus.
Spalvos, kurių sRGB ekranas parodyti negali, sugrąžinamos sumažinant jų chromą, todėl kiekvienas nukopijuotas HEX kodas yra tikra, rodoma spalva.
Kur padeda atsitiktinės spalvos
Atsitiktinės spalvos patogios laikiniems avatarams ir diagramoms, bandomiesiems duomenims, generatyviam menui, dizaino paieškoms, kai užstringi prie tuščio lapo, ar spalvai projektui, žaidimo komandai ar etiketei parinkti. Užfiksavimas leidžia naudoti kaip lošimo automatą: palik, kas veikia, o likusias pasukti iš naujo. Atsitiktinumas gaunamas iš tavo naršyklės kriptografinio generatoriaus, ir niekas niekur nesiunčiama.
Dažnai užduodami klausimai
Kaip gauti atsitiktinį HEX spalvos kodą?
Nustatyk Spalvų skaičius į 1 ir spustelėk Generuoti spalvas, tada spustelėk mygtuką HEX, kad nukopijuotum kodą, pavyzdžiui, #3A7BD5.
Ar galiu palikti kai kurias spalvas ir perkurti kitas?
Taip. Spustelėk Užfiksuoti ant kiekvienos spalvos, kurią nori palikti, tada spustelėk Generuoti spalvas. Užfiksuotos spalvos lieka vietoje; darnos režimu pirma užfiksuota spalva taip pat tampa naujos paletės baze.
Kodėl verta rinktis OKLCH darnos režimą, o ne gryną atsitiktinumą?
Visiškai atsitiktinės spalvos dažnai nesuderinamos arba turi labai skirtingą vizualinį svorį. Sudarius paletę pagal darną OKLCH modelyje gaunamos spalvos, kurios tinka kartu ir turi subalansuotą ryškumą, todėl jas lengviau naudoti dizaine.
Ką turi eksporto formatai?
HEX sąrašas duoda po vieną kodą eilutėje, CSS ir SCSS kintamieji – --color-1 ar $color-1 deklaracijas, JSON masyvas – kodų sąrašą, o Tailwind spalvos – colors objektą su 100, 200… raktais tavo konfigūracijai.
Ar spalvos tikrai atsitiktinės?
Jos gaunamos iš crypto.getRandomValues, kriptografiškai saugaus naršyklės generatoriaus, todėl tarp spustelėjimų joks šablonas nesikartoja.
Susiję įrankiai
- Spalvų paletės generatorius Generuok spalvų paletes iš vienos spalvos pagal derinimo taisykles: komplementinę, analoginę, triadą, tetradą, kvadratą ir monochrominę paletę.
- Spalvų keitiklis Konvertuok spalvą tarp HEX, RGB, HSL, HSV, HWB, CMYK, LAB, LCH ir OKLCH. Įklijuok kodą, pamatyk spalvą ir vienu spustelėjimu nukopijuok bet kurį formatą.
- Spalvų rinkiklis Nemokamas spalvų rinkiklis: pasirink spalvą ir iškart nukopijuok jos HEX, RGB, HSL, HSV bei CMYK kodus su kontrasto santykiais ant baltos ir juodos.
- Atsitiktinių skaičių generatorius Generuok atsitiktinius skaičius bet kokiame intervale, nuo 1 iki 10 000 vienu metu, sveikuosius ar dešimtainius, su pasikartojimais arba be jų.