Spalvų paletės generatorius nemokamai
Generuokite papildančias, analogiškas, triadines ir monochromatines spalvų paletes iš bet kurios pagrindinės spalvos. Kopijuokite šešioliktainius kodus vienu paspaudimu.
Įveskite hex kodą, spalvos pavadinimą, pvz., teal ar tomato, arba rgb(20, 184, 166) / hsl(174, 80%, 40%), tada paspauskite Enter.
Teksto ir fono patikra
Dažniausi naudojimo būdai
- Kurti Spalvų Paleties Žiniatinklio DizainuiKurkite harmoninius spalvų schemas svetainėm, žiniatinklio programomis ir UI komponentams.
- Kurti Prekės ženklo Spalvų PaletisSukurkite pilną prekės ženklo spalvų sistemą iš vienos prekės ženklo spalvos — pirminės, antrinės, akcentai ir neutrals.
- Kurti Spalvų Paletis Meninei IliustracijomKurkite harmoniniaus spalvų kombinacijas skaitmeniniam meninei, iliustracijom ir kūrybiniams projektams.
- Kurti Spalvų Stiliai FigmaiKurkite spalvų paletis naudoti kaip Figma Spalvų Stiliai ir dizaino žetono pamatai.
- Kurti Spalvų Paletis Tamsiajam RežimuiKurkite šviesias ir tamsias savo spalvų paletės variantus tamsiosios režimo paramos kūrimui.
Kaip tai veikia
Įrankis sukurtas be jokių išorinių bibliotekų — visa spalvų matematika vyksta rankomis parašytu JavaScript kodu tiesiai jūsų naršyklėje. Jis konvertuoja pasirinktą spalvą tarp HEX ir HSL, tada per aritmetiką atspalvio ratui taiko klasikines spalvų teorijos harmonijos taisykles (papildomasis, trejybinis, analogiškas ir t.t.), kad sukurtų kiekvieną paletę.
- 1HEX į HSL konvertavimasPasirinkus spalvą, įrankis apdoroja HEX eilutę į RGB komponentus ir konvertuoja juos į HSL (atspalvis, sodrumas, šviesumas). Atspalvis yra 0–360 laipsnių padėtis spalvų rate; visa paletės matematika vyksta šioje erdvėje.
- 2Atspalvio aritmetika harmonijaiKiekvienas paletės tipas yra fiksuota sukimo formulė, taikoma pagrindiniam atspalviui. Papildomasis prideda 180°, trejybinis prideda 120° ir 240°, tetradinis žengia po 90°, papildomasis su padalijimu naudoja 150° ir 210°. Monochromatinis ir atspalvių tipai išlaiko atspalvį ir sodrumą pastovius, keisdami tik šviesumą.
- 3HSL į HEX išvestisKiekvienas apskaičiuotas HSL trejetas konvertuojamas atgal į HEX spalvą, naudojant standartinę chroma formulę. Rezultatai rodomi kaip spalvų juosta su automatiškai kontrastingomis etiketėmis (tamsus tekstas šviesiuose pavyzdžiuose, šviesus tekstas tamsiuose), nustatomomis pagal paprastą šviesumo ribą.
- 4Eksportuokite jums patogiu formatuPaletę galima nukopijuoti kaip HEX eilutes arba eksportuoti kaip CSS kintamųjų failą (:root { --color-1: … }), SCSS kintamuosius, Tailwind konfigūracijos fragmentą, JSON objektą arba PNG spalvų juostą. PNG eksportui naudojamas naršyklės Canvas API (toDataURL), nupiešiantis kiekvieną pavyzdį su jo HEX etikete — viskas sugeneruojama vietoje, spustelėjus.
Susiję įrankiai
Atsitiktinių spalvų generatorius
Generuok atsitiktines spalvas po vieną arba kaip penkių spalvų paletę, užrakink patikusias, kopijuok HEX, RGB ar HSL reikšmes ir eksportuok paletę kaip PNG arba CSS.
Vaizdo spalvų paletės ištraukiklis
Ištraukite dominuojančias spalvas iš bet kokio vaizdo naudodami k-vidurkių spalvų kvantizavimą. Gaukite šešioliktainius kodus 2–16 pagrindinių jūsų nuotraukos ar logotipo spalvų.
Spalvų parinkiklis ir paletės generatorius
Rinkitės spalvas, konvertuokite tarp HEX/RGB/HSL ir generuokite harmoningas paletes.