OpenTools

I-convert ang Color Code — HEX, RGB, HSL, CMYK, Contrast Checker

Gamit ito para ilipat ang kulay ng design mockup sa CSS code, o para suriin kung nababasa nang maayos ang teksto ng button base sa accessibility standard.

Hindi ipinapadala sa server ang file — pinoproseso lang sa loob ng browser ng device na ito

Contrast Checker (WCAG)

Ito ang contrast ratio sa background kapag ginamit ang kulay na ito bilang kulay ng teksto. Body text: AA 4.5:1, AAA 7:1 / Malaking teksto (24px o bold 18.7px pataas): AA 3:1, AAA 4.5:1.

AaBb 123
Puting Background6.29:1
✓ AA Body Text ✗ AAA Body Text ✓ AA Malaking Teksto ✓ AAA Malaking Teksto
AaBb 123
Itim na Background3.34:1
✗ AA Body Text ✗ AAA Body Text ✓ AA Malaking Teksto ✗ AAA Malaking Teksto
AaBb 123
Piniling Kulay #FFFFFF6.29:1
✓ AA Body Text ✗ AAA Body Text ✓ AA Malaking Teksto ✓ AAA Malaking Teksto

Antas ng Liwanag/Dilim

Makokopya ang HEX code kapag pinindot ang kahon.

Ad

Paano Gamitin ang I-convert ang Kulay

  1. 1Ilagay ang color code o piliin gamit ang color picker (#4f46e5, rgb(), hsl() lahat puwede).
  2. 2Lalabas ang code sa lahat ng format, at makokopya ito kapag pinindot.
  3. 3Tingnan ang contrast ratio sa puti, itim, at piniling kulay, kung pumasa sa WCAG, at ang antas ng liwanag/dilim.

Mga Madalas Itanong

Magkano ba ang kailangang contrast ratio?

Kailangan ng WCAG AA ang 4.5:1 pataas para sa body text at 3:1 pataas para sa malaking teksto; para sa AAA, 7:1 at 4.5:1 pataas, ayon sa pagkasunod.

Iba ang CMYK value kumpara sa printing shop.

Simpleng mathematical conversion lang ang CMYK dito. Mag-iiba ang aktwal na print depende sa paper at ink profile, kaya sundin ang pamantayan ng printing shop.

Ad