Especifica una gama de colores dependientes de la posición.
Un degradado de color lineal o axial
En la ciencia del color , un degradado de color (también conocido como rampa de color o progresión de color ) especifica un rango de colores dependientes de la posición , generalmente utilizados para rellenar una región.
Al asignar colores a un conjunto de valores, un degradado es un mapa de colores continuo, un tipo de combinación de colores . En gráficos por computadora, el término muestra [1] ha pasado a significar una paleta de colores activos.
gradientes de color del mundo real o libros de muestras
Un degradado de color axial, con un segmento de línea blanca que conecta los dos puntos.
Un degradado de color axial (a veces también llamado degradado de color lineal) se especifica mediante dos puntos y un color en cada punto. Los colores a lo largo de la línea que pasa por esos puntos se calculan mediante interpolación lineal y luego se extienden perpendicularmente a esa línea. En los sistemas de imágenes digitales , los colores normalmente se interpolan en un espacio de color RGB , a menudo utilizando valores de color RGB comprimidos con gamma , en lugar de lineales. Tanto CSS como SVG admiten gradientes lineales. [8] [9]
gradientes radiales
Un degradado de color radial
Un degradado radial se especifica como un círculo que tiene un color en el borde y otro en el centro. Los colores se calculan mediante interpolación lineal basada en la distancia desde el centro. Esto se puede utilizar para aproximar la reflexión difusa de la luz desde una fuente puntual por una esfera . [ cita necesaria ] Tanto CSS como SVG admiten gradientes radiales. [10] [11]
gradientes cónicos
gradiente cónico
Los degradados cónicos o cónicos son degradados con transiciones de color que giran alrededor de un punto central (en lugar de irradiarse desde el centro). Los ejemplos de gradientes cónicos incluyen gráficos circulares y ruedas de color. [12] Los gradientes cónicos a veces se denominan "gradientes de barrido" (por ejemplo en la especificación OpenType ) o gradientes angulares.
La apariencia de un degradado no sólo varía según el color en sí, sino también según el espacio de color en el que se realiza el cálculo. El problema suele volverse importante por dos razones:
Corrección gamma a un espacio de color. Con un γ típico de alrededor de 2, es fácil ver que un espacio de color habilitado para gamma se mezclará más oscuro que un espacio de color de intensidad lineal, ya que la suma de los cuadrados de dos números nunca es mayor que el cuadrado de su suma. El efecto es más evidente al mezclar colores complementarios como el rojo y el verde, siendo el color medio un color oscuro en lugar del amarillo esperado. [13] [14] Los ejemplos radiales y cónicos de esta página muestran claramente este error.
Manejo de otras propiedades perceptuales. En la visualización de información , no es deseable que un gradiente supuestamente "plano" muestre variaciones no monótonas en luminosidad y saturación a lo largo del camino. Esto se debe a que la visión humana enfatiza estas cualidades, provocando sesgos o confusión en la interpretación. [15]
Una mezcla "lineal" coincidiría con la mezcla física de luces y ha sido el estándar en los motores de juegos durante mucho tiempo. [16] En la web, sin embargo, se ha descuidado durante mucho tiempo tanto para los degradados de color como para el escalado de imágenes. [17] Una combinación de este tipo todavía tiene una diferencia sutil con respecto a una realizada en un espacio de color perceptualmente uniforme. [18]
llenar una región: [20] muchos administradores de ventanas permiten que el fondo de la pantalla se especifique como un degradado. Los colores producidos por un degradado varían continuamente con la posición, produciendo transiciones de color suaves.
visualizar la progresión de una operación informática extendida, como una descarga, transferencia de archivos o instalación. Ver barra de progreso
Libros de muestras (como en el libro de muestras de colores de papel o el abanico de colores RAL CLASSIC K5 o las guías de colores Pantone)
Referencias
^ cssgradient: Muestras de degradado CSS
^ Esquema de colores 'cubehelix' de Dave Green
^ Mapas de colores divergentes para visualización científica - Kenneth Moreland
^ Lo bueno, lo malo y lo feo: un marco teórico para la evaluación de mapas de colores continuos por Roxana Bujack, Terece L. Turton, Francesca Samsel, Colin Ware
^ qué-escala-de-color-usar-en-datos-vis por Lisa Charlotte Rost
^ Fabio Crameri: mapas científicos de colores
^ Una encuesta y evaluación de la calidad basada en tareas de mapas de colores estáticos 2D Autor(es): Bernard, Jürgen; Steiger, Martín; Mittelstädt, Sebastián; Bueno, Simón; Keim, Daniel; Kohlhammer, Jörn, In Kao, David L. (Ed.); Sociedad de Ciencia y Tecnología de la Imagen -IS&T-; Sociedad de ingenieros de instrumentación fotoóptica -SPIE-, Bellingham/Wash.: Visualización y análisis de datos 2015: 9 a 11 de febrero de 2015, San Francisco, California Bellingham, WA: SPIE, 2015 (Actas de SPIE 9397) ISBN 9781628414875
^
Degradados lineales en "Valores de imagen CSS y módulo de contenido reemplazado nivel 3", Recomendación del candidato del W3C, abril de 2012
^
Degradados lineales en "SVG 1.1 (segunda edición)", Recomendación del W3C, agosto de 2011
^
Degradados radiales en "Valores de imagen CSS y módulo de contenido reemplazado nivel 3", Recomendación del candidato del W3C, abril de 2012
^
Degradados radiales en "SVG 1.1 (segunda edición)", Recomendación del W3C, agosto de 2011
^ documentos de mozilla: gradiente cónico CSS
^ Minuto de Física (20 de marzo de 2015). "El color de la computadora está roto". YouTube . Archivado desde el original el 21 de diciembre de 2021.
^ Novak, John (21 de septiembre de 2016). "Lo que todo codificador debería saber sobre gamma".
^ Zeileis, Achim; Pescador, Jason C.; Hornik, Kurt; Ihaka, Ross; McWhite, Claire D.; Murrell, Pablo; Stauffer, Reto; Wilke, Claus O. (2019). "Colorspace: una caja de herramientas para manipular y evaluar colores y paletas". arXiv : 1903.06490 [estad.CO].
^ "Capítulo 24. La importancia de ser lineal". Desarrollador NVIDIA .
^ "El color de la web todavía está roto".
^ "Cómo el software se equivoca con el color". bottosson.github.io .