Krāsu toņu ģenerators
Ģenerējiet tumšākus krāsas toņus, vienmērīgos soļos sajaucot krāsu ar melnu. Ievadiet vienu krāsu jebkurā CSS formātā, izvēlieties no 2 līdz 20 soļiem un sajaukšanas telpu, un iegūstiet tabulu ar HEX, RGB, HSL un OKLCH vērtībām katram tonim, sākot ar sākotnējo krāsu. Sajaukšana sRGB telpā atbilst klasiskajiem toņu rīkiem un Sass, savukārt OKLab nodrošina perceptuāli vienmērīgus soļus. Ideāli piemērots UI krāsu skalu veidošanai.
Bieži uzdotie jautājumi
Kas ir krāsas tonis?
Krāsas tonis ir krāsa, kas sajaukta ar melnu. Tā saglabā savu nokrāsu un kļūst tumšāka, atšķirībā no gaišā toņa, ko sajauc ar baltu, vai piesātinājuma toņa, ko sajauc ar pelēku.
Kā tiek noteikti soļu intervāli?
Ja ir N soļi, k. rinda sajauc krāsu ar (k - 1) / N melnās krāsas, tāpēc 10 soļi dod 0%, 10%, 20% un tā tālāk līdz 90%. Pirmā rinda vienmēr ir sākotnējā krāsa, un tīri melna krāsa sarakstā nekad netiek iekļauta.
Kāda ir atšķirība starp sRGB un OKLab sajaukšanu?
Sajaucot sRGB telpā, tiek aprēķināta gamma kodēto kanālu vērtību vidējā vērtība, kā to dara Sass mix(), sajaucot ar melnu, un lielākā daļa klasisko toņu ģeneratoru. Sajaukšana OKLab telpā notiek perceptuālā telpā, tāpēc soļi gaišuma ziņā šķiet vienmērīgāki un tumšākie toņi saglabā vairāk krāsas.
Kādus ievades formātus varu izmantot?
Heksadecimālie kodi ar # vai bez tā, CSS krāsu nosaukumi, rgb(), hsl(), hwb(), lab(), lch(), oklab(), oklch(), color() un cmyk(). Katrā palaišanas reizē ievadiet vienu krāsu.
Cik toņu varu ģenerēt?
No 2 līdz 20 vienā palaišanas reizē; pēc noklusējuma 10. Skaitā ir iekļauta sākotnējā krāsa pirmajā rindā.
Kādas vērtības tiek rādītas tabulā?
Katram solim — melnās krāsas daļa, heksadecimālais kods, rgb(), hsl() un oklch() mūsdienu CSS sintaksē. RGB kanālu vērtības ir veseli skaitļi, HSL procentuālās vērtības tiek norādītas ar ne vairāk kā divām zīmēm aiz komata, bet OKLCH gaišums un krāsainība — ar ne vairāk kā četrām.
Kas notiek ar caurspīdīgām krāsām?
Ievades alfa vērtība tiek saglabāta katram tonim, jo melnā krāsa tiek piejaukta ar tādu pašu alfa vērtību. Heksadecimālajiem kodiem ir 8 cipari, un CSS funkciju beigās pēc slīpsvītras ir alfa vērtība.
Kas notiek ar krāsām ārpus sRGB?
Sajaukšanā tiek izmantota pilna krāsa, taču HEX, RGB un HSL var attēlot tikai sRGB, tāpēc toņi ārpus gammas šajās kolonnās tiek pārveidoti uz sRGB, izmantojot CSS Color 4 algoritmu. OKLCH kolonnā tiek saglabāta nepārveidotā vērtība.
Kā izmantot toņus CSS?
Iekopējiet heksadecimālās vai oklch() vērtības pielāgotos rekvizītos, piemēram, --brand-600 un --brand-700. Lai sajauktu krāsas pārlūkprogrammā, izmantojiet color-mix(in oklab, var(--brand) 80%, black), kas dod tādu pašu 20% toni kā OKLab iestatījums.
Vai tumšāki toņi automātiski ir pieejami?
Nē. Pārbaudiet teksta kontrastu ar katru toni, jo tumšs tonis joprojām var nesasniegt 4.5:1 kontrasta attiecību pret citu tumšu krāsu vai krāsainu tekstu.