Qué hace
Pegue un color en cualquier formato y obtenga todos los demás, cada uno con su botón de copiar: HEX, RGB, HSL, HWB, OKLCH, OKLab, CIE Lab/LCH (D50) y color(display-p3 …). También lee y escribe lo que usa el código .NET: Color.FromArgb(…) (int, ARGB o alfa + color con nombre), Color.FromRgb, Colors.Red, el texto Color [A=…, R=…] de ToString(), 0xAARRGGBB, enteros con signo de ToArgb() y #AARRGGBB de XAML. Use el interruptor hex de 8 dígitos para elegir si #xxxxxxxx sigue el orden de CSS o el de .NET.
Lab, LCH y OKLCH pueden describir colores que sRGB no puede mostrar. Esos colores se señalan y los valores hex/RGB se ajustan a la gama con el método de CSS Color 4 (reducción del croma en OKLCH) en lugar de recortarse. Los cálculos siguen CSS Color 4: curva de transferencia sRGB, punto blanco D65, adaptación de Bradford a D50 para Lab y el OKLab de Björn Ottosson.
Contraste
El color que introduce se trata como texto y el segundo color como fondo. Obtiene la relación de contraste WCAG 2.x con aprobado/suspenso para AA y AAA (texto normal y grande) y para componentes de interfaz (3:1). La relación se redondea hacia abajo, de modo que un par mostrado como 4.5:1 aprueba de verdad. El valor Lc de APCA se muestra solo a título informativo, porque no forma parte de WCAG 2.x. Los colores semitransparentes se componen como los dibujaría un navegador.
Cuando un par no aprueba, la herramienta sugiere los colores de texto y de fondo válidos más cercanos cambiando solo la luminosidad OKLCH, de modo que el tono y el croma no cambian. Haga clic en Aplicar para usar uno.
Paleta
La escala de tonos de 50 a 950 se construye en OKLCH, y su color aparece sin cambios en el escalón más cercano. Cópiela como propiedades personalizadas de CSS, como bloque colors de Tailwind v3 o como bloque @theme de Tailwind v4.
Privacidad
Todo se ejecuta en su navegador. Las entradas solo se guardan en el almacenamiento local de su navegador.