Calibración óptica de iconos
Convierte un icono negro en el color CSS que necesitas.
Introduce cualquier color CSS opaco y calcula una cadena de filtros determinista para un SVG, icono o imagen monocroma de color negro. Compara el objetivo con el resultado estimado antes de publicarlo.
#000000#7B3DEERuta de señal en seis etapas
Observa cada ajuste.
El algoritmo ajusta una cadena acotada en un orden fijo. Un mismo objetivo produce los mismos valores y el color introducido no sale del navegador.
- 01invert()
46% - 02sepia()
95% - 03saturate()
7156% - 04hue-rotate()
71 × 3.6° - 05brightness()
98% - 06contrast()
90%
CSS listo para copiar
Aplica la cadena a un recurso negro.
Usa esta declaración en un elemento cuyos píxeles visibles comiencen en negro puro. Los recursos multicolor o que no sean negros requieren otro proceso.
filter: invert(46%) sepia(95%) saturate(7156%) hue-rotate(256deg) brightness(98%) contrast(90%);- Objetivo
- #7C3AED
- Resultado estimado
- #7B3DEE
- Error medio por canal RGB
- 1,53
Una aproximación con pruebas visibles.
Hexees simula las matrices de color de CSS Filter Effects, minimiza la distancia RGB y HSL mediante una búsqueda acotada determinista e informa del color obtenido. El rasterizado y la gestión del color del navegador aún pueden alterar los píxeles finales; comprueba el recurso real.