breve explicacion recopilada de diferentes medios acerca de espacios de color

1. Espacios de color
L I C . E N A R T E D I G I T A L
P R I M E R S E M E S T R E
M T R A . K A R I N A F L O R E S S E M A N A 6 . S E P T I E M B R E , 2 0 2 3

2. RGB y CMYK son diferentes
esquemas para representar los
colores.
•RGB es el acrónimo de Red, Green,
Blue.
Para web usaremos siempre
RGB.
•CMYK es el acrónimo de Cian,
Magenta, Yellow y Black. Para
impresión en papel física usaremos
siempre CMYK. Esto es flyers,
tarjetas de visita, carpetas,
proyectos, etc.

3. Esta foto de Autor desconocido se concede bajo licencia de CC BY-NC-ND.

4. Los colores CMYK reciben este nombre
por los cuatro colores básicos que se
utilizan en las impresiones a color: cian,
magenta, amarillo y negro.

5. La principal función de los colores CMYK son
los materiales impresos ya que a diferencia de
los colores RGB, que son más utilizados en
aparatos digitales, tienen menos brillo. La
utilización de este modelo de colores es la forma
más común de impresión y es perfecta para que
puedas imprimir
Este modelo crea otros colore
s basándose en la mezcla de
los colores CMY (cian, mag
enta y amarillo) ya que
la unión de estos tres colores
en fondo blanco crea el color
negro, que no es un
color primario

6. RGB

7. Todo color en una pantalla se puede representar como una mezcla de
estos 3 colores, indicando la proporción de cada uno con un número
del 0 al 255.
Por ejemplo:
•El rojo se representaría como rgb (255,0,0)
•El verde se representaría como rgb (0,255,0)
•El azul se representaría como rgb (0,0,255)
Y de las mezclas anteriores obtendríamos:
•El amarillo se representaría como rgb (255,255,0)
•El azul cyan se representaría como rgb (0,255,255)
•El rosa magenta se representaría como rgb (255,0,255)
•El blanco se representaría como rgb (255,255,255)
•El negro se representaría como rgb (0,0,0)

9. RGB

10. RGBa es una derivada de RGB en la que se incluye un cuarto
parámetro «a» que indica el grado de transparencia – alpha
channel.
Indica de una escala de 0 a 1 el porcentaje de puntos que
vamos a dejar de «pintar».
•0, significa que no vamos a pintar nada, es decir
transparencia total.
•1, significa que vamos a pintar todo, es decir el
máximo grado de relleno de color posible

12. YCbCr

13. Y'CBCR no es un espacio de color
absoluto, sino una forma de
codificar información RGB.
El color que se muestra depende
de la combinación de colores
primario RGB usados para mostrar
la señal.
Por lo tanto, un valor expresado
como Y'CBCR es predecible solo si
se usa la cromaticidad de los
colores del estándar RGB.

14. YCbCr, también conocido como Y'CbCr, Y
Pb/Cb Pr/Cr, YCBCR o Y'CBCR es una familia
de espacio de color usada en sistemas
de vídeo y fotografía digital.
Y y Y' representan la componente de luma y
las señales CB y CR son los componentes
de crominancia diferencia de azul y
diferencia de rojo, respectivamente.
Y' se diferencia de Y en que es la señal de
luma codificada de manera no lineal basada
en las señales primarias RGB con corrección
gamma.

15. https://youtu.be/JNnPoEueSpM
YCbCr RGB
YCbCr es una familia de espacio de
color usada en sistemas de vídeo y
fotografía digital. Y representa el
componente de luminancia (luma) y
las señales CB y CR son los
componentes de crominancia
diferencia de azul y diferencia de rojo,
respectivamente (1).
Se utiliza el submuestreo de
crominancia para procesar y eliminar
algunos de los datos de color rojo y
azul y el procesamiento de gamma,
contraste y brillo para los datos de
luminancia.
RGB es la representación de un color
mediante la mezcla por adición de los
tres colores de luz primarios

16. YCbCr RGB
YCbCr utiliza menos ancho de banda
y es ideal para la transmisión de video
o la compresión de imágenes.
Permite mostrar colores mucho más
vivos y es ideal en pantallas para PC
para trabajar en ofimática, internet o
videojuegos en Full RBG.
YCbCr RGB
No existe el color negro, solo mostrará
un color gris muy similar al color
negro.
Cada píxel contiene 3 colores, por lo
que se requiere más almacenamiento
para almacenar una imagen en color
que una imagen sin color.
¿Cuál es la desventaja de YCbCr y RGB?
¿Cuál es la ventaja de YCbCr y RGB?

17. YCbCr RGB
Está más diseñado para sistemas
de televisión digital. Depende
también del tipo de pantalla que
tengas, puedes mejorar la calidad de
los colores con la calibración. Puede
que algunas pantallas no sea el más
adecuado esta configuración y
necesites configurarlo como RGB.
Es ideal pantallas de
computadoras en donde verás unos
colores muchos más vivos al momento
de trabajar y jugar.
¿Cuál es mejor en una conexión HDMI?

18. Color Hexadecimal

19. Hexadecimal significa que vamos a utilizar un sistema
de numeración con los carácteres:
0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F.
16 CARACTERES = De aquí el número.
Siendo 0 la unidad mínima y F el valor de orden
máximo.
Hexadecimal tiene la misma filosofía que RGB.
Representamos los colores a partir de 3 bloques de
rojo, verde y azul salvo que esta vez con los carácteres
0-F.
Delante de cada color se usa el símbolo hashtag #

20. Por ejemplo:
•El rojo se representaría como #ff0000
•El verde se representaría como#00ff00
•El azul se representaría como#0000ff
Y de las mezclas anteriores obtendríamos
•El amarillo se representaría como #ffff00
•El azul cyan se representaría como#00ffff
•El rosa magenta se representaría como #ff00ff
•El blanco se representaría como #ffffff
•El negro se representaría como #000000

21. El hexadecimal tiene una particularidad que es cuando dos letras o
números contiguos (dentro del bloque rojo, verde o azul) van a ser
idénticos entonces podemos omitir una de las dos letras o
números.
Por ejemplo;
•El rojo se representaría como #ff0000 pero de forma
resumida también se puede representar como #f00
•El verde se representaría como#00ff00 pero de forma
resumida también se puede representar como #0f0
•El azul se representaría como#0000ff pero de forma
resumida también se puede representar como #00f

23. Color Web

24. https://coolors.co/
https://color.adobe.com/e
s/create/color-wheel

25. HSI

26. HSI
(sigla del inglés Hue, Saturation, Intensity;
en español, ‘matiz, saturación, intensidad’)
HSL
(sigla del inglés Hue, Saturation, Lightness;
en español, ‘matiz, saturación, luminosidad’)
define un modelo de color en
términos de sus componentes
constituyentes.
El modelo HSL se puede
representar gráficamente como
un cilindro, un cono doble
(similar al de Ostwald)1​, una
pirámide hexagonal doble, un
prisma hexagonal, un cubo,
entre otras representaciones.

27. El ángulo en torno al eje central se
corresponde con el matiz, la distancia al
eje se corresponde con la saturación, y la
distancia desde la base (negro) se
corresponde con la luminosidad.
Cuando la luminosidad es igual al 0 %, sin
importar los otros dos valores, el color
será negro, y cuando la luminosidad es
igual al 100 %, sin importar los otros dos
valores, el color será blanco.
Al igual que el modelo HSV, es una
deformación no lineal del espacio de
color RGB.
Nótese que HSL es lo mismo que HSI,
pero no que HSV o HSB.

28. En HSL, la componente de la
saturación va desde el
completamente saturado hasta el
gris equivalente,
mientras que en HSV, con V al
máximo, va desde el color saturado
hasta el blanco, lo que no es muy
intuitivo.
matiz 100%
puro
75% de
saturación
saturación
media
25% de
saturación
0 de
saturación
matiz 100%
puro
75% de
saturación
saturación
media
25% de
saturación
0 de
saturación

29. HSL es similar al modelo HSV pero refleja
mejor la noción intuitiva de la saturación y
la luminancia como dos parámetros
independientes, y por tanto es un modelo
más adecuado para los artistas.
La especificación de las hojas de estilo en
cascada (CSS) en su versión 3
prefieren HSL porque es simétrico al eje
luz-oscuridad
•La luminancia en HSL siempre va
desde el negro hasta el blanco
pasando por la tonalidad deseada,
mientras que en HSV la componente
V se queda a mitad camino, entre el
negro y la tonalidad escogida.
•Aplicaciones que usan HSL:
•La especificación CSS3
•Facebook api web
Developer
•Inkscape (desde la
versión 0.42)
•Macromedia Studio
•Microsoft
Windows system color
picker (y MSPaint)
•Paint Shop Pro

30. HSB

31. Modelo de color HSB
(Hue, Saturation, Brightness – Tonalidad,
Saturación, Brillo) -
HSV
(Hue, Saturation, Value).

32. El modelo HSB (o HSV, como se prefiera) deriva
del espacio RGB y representa los colores
combinando tres valores:
el tono en sí (H), la saturación o cantidad de
color (S) y el brillo del mismo (B)
Estas tres magnitudes pueden tener los siguientes valores:
•H (color en concreto). Valores de 0-360º. La gama cromática se
representa en una rueda circular y este valor expresa su posición.
•S (Saturación). Valores de 0-100%. De menos a más cantidad de
color.
•B (Brillo). Valores de 0-100%. De totalmente oscuro a la máxima
luminosidad.

33. Uso del modelo de color HSB (HSV).
Este modelo fue creado para aportar tanto
información sobre el color en sí como sobre la
cantidad y brillo del mismo, representando
todo a la vez en un mismo diagrama
cromático. HSB presenta los colores y sus
diferentes grados de brillo y saturación en un
único diagrama -cónico o circular-
Para programadores de software gráfico, el modelo HSB no va a
tener demasiada utilidad. Sin embargo podemos encontrarlo con
cierta frecuencia y es necesario conocerlo.