Kādus krāsu kodus tas man sniedz?

HEX, RGB, HSL, HSV, CMYK un OKLCH vienai un tai pašai krāsai, gatavus kopēšanai.

Vai varu izvēlēties krāsu no sava ekrāna?

Jā, ar Izvēlēties no ekrāna Chromium balstītos pārlūkos, piemēram, Chrome un Edge. Poga ir paslēpta, ja jūsu pārlūks to neatbalsta.

Vai tas pārbauda, vai teksts uz krāsas ir salasāms?

Jā. Tas parāda WCAG kontrasta attiecību pret baltu un melnu un atzīmē to kā AA large, AA, AAA vai Fails. Tas arī iesaka komplementārās, triādiskās, analogās un monohromatiskās krāsas.

Vai tas tiešām ir bezmaksas?

Jā. Katrs rīks ir bezmaksas, bez konta un kredītkartes. Darbs notiek jūsu ierīcē, nevis mūsu serveros, tāpēc tas ir bezmaksas.

Vai tas darbojas mobilajā ierīcē?

Jā. Tas darbojas mūsdienu mobilajos pārlūkos iOS un Android ierīcēs, nekas nav jāinstalē.

🎨

Krāsu izvēlētājs un paletes ģenerators bez maksas

Izvēlieties krāsas, konvertējiet starp HEX/RGB/HSL un ģenerējiet harmoniskas paletes.

Darbojas pārlūkprogrammāBez reģistrācijas, bez uznirstošiem logiemNav nepieciešama pieteikšanāsBezmaksas uz visiem laikiem

Darbojas bezsaistē pēc ielādes

Krāsu izvēlētājs

HEX

HSV

h217°

s76%

v96%

tikai displejs

RGB

HSL

Vairāk formātu

Alfa100%

HEX8#3b82f6ff

RGBrgb(59 130 246)

HWBhwb(217 23% 4%)

CMYKcmyk(76%, 47%, 0%, 4%)

OKLCHoklch(62.3% 0.188 259.8)

SwiftUIColor(red: 0.231, green: 0.510, blue: 0.965, alpha: 1)

Android0xFF3B82F6

FlutterColor(0xFF3B82F6)

WCAG kontrasts

Tuvākā nosauktā krāsa: dodgerblue · Šeit vieglāk lasāms melns teksts (5,71:1)

Teksts uz balta3,68:1AA liels

Teksts uz melna5,71:1AA

Teksts uz #ffffff3,68:1AA liels

Salīdzināt ar citu krāsu

Toņi un nokrāsas (50–950)

Nosaukums

Krāsu palete

Komplementārs

#3b82f6

#f6af3c

Triādisks

#3b82f6

#f63c83

#83f63c

Analogs

#3ce0f6

#3b82f6

#523cf6

Monohromatisks

#073c92

#0a5adb

#3b82f6

#85b2f9

#cee0fd

Biežākie lietojumi

Krāsu atlasītājs tīmekļa dizainamAtlasiet un ģenerējiet krāsas savam vietnei — iegūstiet HEX, RGB un HSL vērtības un harmoniskas paletes.
Krāsu atlasītājs zīmolamIzveidojiet sava zīmola krāsu paleti — atlasiet primāro, otrreizējās un uzsvara krāsas, kas darbojas kopā.
Krāsu atlasītājs sociālajiem medijiemIzveidojiet pievilcīgas krāsu paletes sociālo mediju ierakstiem, stāstiem un profila dizainam.
Krāsu atlasītājs drukāšanas dizainamAtlasiet krāsas drukājamam materiālam — broširām, vizītkartēm, broširām — ar precīzu krāsu priekšskatījumu.
Krāsu atlasītājs prezentācijāmNoformējiet slaidu krāsu shēmas — atlasiet lasāmības teksta krāsas, diagrammu paletes un konsekventi uzsvara toņus.

Kā tas darbojas

Viss darbojas tieši jūsu pārlūkprogrammā, izmantojot pašrakstītu konvertēšanas matemātiku — bez krāsu bibliotēkas, bez servera saziņas. Jūs izvēlaties krāsu caur pārlūkprogrammas vietējo krāsu ievadi vai EyeDropper API, un rīks to uzreiz konvertē sešos formātos, vienlaikus aprēķinot WCAG kontrasta attiecības un ģenerējot harmonijas paletes.

1
Krāsu ievade caur vietējo API
Jūs izvēlaties krāsu caur pārlūkprogrammas iebūvēto <input type="color"> vidžetu, vai — Chromium bāzētās pārlūkprogrammās — EyeDropper API ļauj paraudzīties jebkuru pikseli jūsu ekrānā. Abi ceļi atgriež heksadecimālo virkni, kas kļūst par vienoto patiesības avotu.
2
Pašrakstītas formāta konvertēšanas
Rīks konvertē heksadecimālo vērtību uz RGB, HSL, HSV, CMYK un OKLCH, izmantojot savas matemātikas funkcijas (bez ārējas bibliotēkas). OKLCH konvertēšana linearizē sRGB kanālus, pielieto OKLab kuba saknes matricu, tad atvasina hromu un toņa leņķi — atbilstoši modernajai CSS Color Level 4 izvadei.
3
WCAG kontrasta attiecības aprēķins
Relatīvais gaišums tiek aprēķināts no linearizētiem RGB kanāliem, izmantojot WCAG 2.x formulu. Rīks tad aprēķina kontrasta attiecības pret tīri baltu un tīri melnu un marķē tās kā AA-liels, AA, AAA vai Neizpildīts saskaņā ar WCAG sliekšņiem (3:1, 4.5:1, 7:1).
4
Harmonijas paletes ģenerēšana un lokāla saglabāšana
Komplementārie, triādiskie, analogie un monohromatiskie paraugi tiek atvasināti, matemātiski rotējot vai soļojot HSL toni un gaišuma vērtības. Saglabātās paletes tiek rakstītas localStorage jūsu pārlūkprogrammā — nekas neatstāj jūsu ierīci.