Verificador de Compatibilidad de Navegador OKLCH
Verifique el soporte de su navegador para el espacio de color OKLCH y funciones CSS modernas. Pruebe la compatibilidad de CSS Color Level 4 incluyendo color-mix(), colores relativos, Display-P3, LAB, LCH y más.
使用指南
1. 自动检测:打开页面后自动检测您当前浏览器的 OKLCH 支持情况。
2. 功能检查:查看详细的功能支持列表,包括 color-mix()、相对颜色、Display-P3 等。
3. 获取建议:如果不支持某些功能,查看渐进增强建议和回退方案。
4. 了解浏览器支持:查看各浏览器版本对 OKLCH 的支持情况,了解何时可以使用这些功能。
Acerca del Soporte de Navegador OKLCH
OKLCH es parte de la especificación CSS Color Level 4, proporcionando un espacio de color perceptualmente uniforme para diseño web. Esta herramienta verifica el soporte de su navegador para OKLCH y funciones de color modernas relacionadas.
Resumen de Soporte de Navegador
- Chrome/Edge 111+: Full OKLCH support including color-mix() and relative colors
- Safari 15.4+: OKLCH support with progressive enhancements in newer versions
- Firefox 113+: Complete CSS Color Level 4 support including OKLCH
Mejores Prácticas de Implementación
Al usar OKLCH en producción, siempre proporcione colores de respaldo para navegadores que no lo soporten. Use detección de características CSS con @supports para mejorar progresivamente su experiencia de color.
/* Provide fallback for older browsers */
.element {
background: #00bca2; /* Fallback */
background: oklch(70% 0.150 180);
}
/* Feature detection with @supports */
@supports (color: oklch(0% 0 0)) {
.element {
background: oklch(70% 0.150 180);
}
}