Lumaktaw sa pangunahing nilalaman

Libreng Converter ng Kulay

I-convert ang mga kulay sa pagitan ng HEX, RGB, HSL, HSV, at CMYK na mga format nang mabilis. Kasama ang lightness scale at mga preset na swatch.

Gumagana offline kapag na-load na

I-convert ang isang kulay sa pagitan ng HEX, RGB, HSL, HSV at CMYK β€” na may live preview at one-tap copy. Lahat ay tumatakbo sa iyong browser.

Tinatanggap: HEX (#fff o #ffffff), RGB (255, 255, 255), o HSL (360, 100%, 50%)

100%
Mga preset:
HEX#14B8A6
rgb() Β· legacyrgb(20, 184, 166)
rgb() Β· modernorgb(20 184 166)
hsl() Β· legacyhsl(173, 80%, 40%)
hsl() Β· modernohsl(173 80% 40%)
oklch()oklch(70.4% 0.123 182.5)
lab()lab(67.1% -42.9 -2.3)
lch()lch(67.1% 43.0 183.1)
hsv()hsv(173, 89%, 72%)
cmyk()cmyk(89%, 0%, 10%, 28%)
Mga halaga ng RGB20, 184, 166

WCAG contrast

Sa puting background

2.49:1

Nabigo

Sa itim na background

8.44:1

AAA
πŸ–¨οΈ Para sa pagpi-print: Ang mga CMYK value na ito (89%, 0%, 10%, 28%) ay isang karaniwang sRGBβ†’CMYK na approximation para sa sanggunian. Para sa tumpak na kulay sa pag-print, gamitin ang ICC profile ng iyong printer o isang printed proof β€” hindi kayang tumugma ng screen CMYK sa bawat ink/papel.

Sukat ng liwanag

I-click ang kahit anong swatch para lumipat sa kulay na iyon

Mga karaniwang gamit

  • I-convert ang Colors para sa Web DesignMakakuha ng HEX, RGB, at HSL values para sa anumang kulay β€” handa nang i-paste sa CSS o Tailwind.
  • I-convert ang Colors para sa Print (CMYK)I-convert ang screen colours (HEX/RGB) sa CMYK values para gamitin sa print design at professional printing.
  • Bumuo ng Color Palettes para sa Design SystemsI-convert ang brand colours sa lahat ng formats at lumikha ng consistent lightness scales para sa full design system.
  • Suriin ang Colour Contrast para sa AccessibilityI-convert ang colours upang makakuha ng RGB values para gamitin sa contrast ratio tools β€” WCAG compliance para sa accessible design.
  • I-convert ang Colors para sa FigmaMakakuha ng exact HEX at RGB values upang i-paste sa Figma colour pickers at design token systems.

Paano ito Gumagana

Hand-written na JavaScript ang lahat ng conversion logic na buong tumatakbo sa iyong browser β€” walang library, walang server call. Pina-parse ng tool ang input mo, ipinapasa sa isang serye ng purong math function, at sabay-sabay na gumagawa ng labing-isang output format kasama ang mga modernong CSS Color 4 space na oklch() at lab().

  1. 1
    Flexible na pag-parse ng input
    Tumatanggap ang isang custom na parser ng hex (3, 4, 6, o 8 digit), rgb()/rgba(), hsl()/hsla() sa lumang comma syntax at modernong space syntax, at mga payak na numeric triple. Nino-normalize sa saklaw na 0–1 ang mga alpha value na decimal o porsiyento bago magsimula ang anumang conversion.
  2. 2
    RGB bilang sentro ng conversion
    Unang nire-resolve ang bawat tinatanggap na format sa isang canonical na RGB triplet. Mula sa iisang representasyong iyon, sumasanga ang tool: gumagamit ang HSL at HSV ng karaniwang min/max/chroma formula; kinukuha ang CMYK sa paghahanap ng key channel; at ina-apply ang sRGB linearization (ang piecewise gamma curve na tinukoy sa IEC 61966-2-1) bago ang mga kalkulasyon sa perceptual space.
  3. 3
    Mga perceptual color space na kinakalkula mula sa simula
    Kinakalkula ang oklch() gamit ang mga reference 3Γ—3 matrix ni BjΓΆrn Ottosson (LMS cube-root space). Gumagamit ang lab() at lch() ng Bradford chromatic adaptation para mag-convert mula sa D65 white point papuntang D50, na tugma sa kung paano tinutukoy ng CSS Color 4 ang lab(). Ito rin ang mga formula na ginagamit sa mga rendering engine ng browser β€” ipinatupad dito nang walang anumang panlabas na dependency.
  4. 4
    WCAG contrast at lightness scale
    Kinakalkula ang relative luminance ayon sa WCAG 2.1 formula (linearized na R, G, B na may bigat na 0.2126/0.7152/0.0722) at ang contrast ratio laban sa puti at itim ay binibigyan ng grado na AA-large, AA, AAA, o Fail. Gumagawa ng siyam na hakbang na lightness strip sa pag-hakbang ng HSL lightness channel mula 10% hanggang 90%, at puwede mong i-click ang kahit anong swatch para i-convert ang shade na iyon.

Mga Kaugnay na Tool

Mga Madalas na Itanong