FANDOM


El color puede añadirse a tu comunidad en una variedad de lugares. Por ejemplo, puedes utilizar el diseñador de temas para personalizar la paleta de colores tu wiki. Además, puede añadir colores más específicos a través de las plantillas y el CSS.

Definiendo los colores

Códigos Hexadecimales

Prácticamente todos los colores imaginables puede ser representados por un código hexadecimal de seis dígitos, es decir, una representación número de la cantidad de rojo, verde y azul presente en un color particular. RGBA es otro código de color que es frecuentemente usado en el internet e incluye sólo el rojo, verde y azul, sino también el "alfa" o la transparencia de estos. Por lo tanto, los códigos hexadecimales y RGBA son más precisos, aunque menos amigables, que los nombres de colores.

En los cuadros ubicados aquí abajo se encuentra algunos códigos hexadecimales para algunos colores. Si deseas utilizarlos, solo añádelos donde sea apropiado. Por ejemplo, si deseas hacer un botón de color blanco en el diseñador de temas, copia el código hexadecimal del color (#FFFFFF), y añádelo al espacio correspondiente de la pestaña "personalizar".

Nota: los códigos hexadecimales no son sensibles a las mayúsculas, por lo tanto, #ffffff y #FFFFFF significan lo mismo.

Nombres de colores

Hay dos categorías principales para nombrar los colores que son más utilizadas, HTML y X11.

Nombres de colores HTML

Para simplificación de su uso, algunos colores tienen palabras clave de color, nombres que no son sensibles a las mayúsculas como red y YeLLow. El HTML 4.01 [1] define dieciséis colores con nombre, de la siguiente manera:

Nombre Código Hex
cyan #00FFFF
navy #000080
black #000000
olive #808000
blue #0000FF
purple #800080
fuchsia #FF00FF
red #FF0000
Nombre Código Hex
green #008000
silver #C0C0C0
gray #808080
teal #008080
lime #00FF00
white #FFFFFF
maroon #800000
yellow #FFFF00


Nombres de colores RGBA

Nota: También podrá encontrar códigos RGB, de los cuales son los mismos que los códigos RGBA, pero sin el alfa, de lo cual los hace funcionalmente equivalente a los códigos de color HTML enlistados aquí arriba.

Los canales de color varían en valor, entre 0 y 255; mientras que con el canal alfa, o el canal de transparencia es siempre un valor de entre 0 y 1, con 0 denotando completa transparencia y 1 denotando completa opacidad, o sin manifestar transparencia.

El primero de los 4 números representa el canal rojo, el segundo el canal verde, el tercero el canal azul, y el cuarto el canal alfa.

Nombre Código RGBA
cyan rgba(0, 255, 255, 1)
navy rgb(0, 0, 128, 1)
black rgba(0, 0, 0, 1)
olive rgb(128, 128, 0, 1)
blue rgb(0, 0, 255, 1)
purple rgb(128, 0, 128, 1)
fuchsia rgb(255, 0, 255, 1)
red rgb(255, 0, 0, 1)
Nombre Código RGBA
green rgb(0, 128, 0, 1)
silver rgb(192, 192, 192, 1)
gray rgb(128, 128, 128, 1)
teal rgb(0, 128, 128, 1)
lime rgb(0, 255, 0, 1)
white rgba(255, 255, 255, 1)
maroon rgb(128, 0, 0, 1)
yellow rgb(255, 255, 0, 1)


Nombres de colores X11

Si has pasado tiempo tiempo codificando, sabes que otros nombres de colores, como cornflowerblue y linen. Estas palabras claves de colores extendidas son nombres de colores X11, definidos por los buscadores web.

Una larga lista de colores utilizables y equivalentes a los códigos hexadecimales se puede encontrar en Wikipedia. [2][3]

Colores Fluorescentes

Los colores fluorescentes o neón puede asimilar que brillan en las páginas de tu comunidad, dependiendo de como hayas manejado la base de colores de tu comunidad en el diseñador de temas. El efecto puede ser atrayente y efectivo.

Nombre Código Hex
Rainshower #C9FFE5
Blizzard Blue #A3E3ED
Psychedelic Purple #FA00FF
Harlequin #3FFF00
Bubbles #E7FEFF
Razzle Dazzle Rose #FF33CC
Electric Purple #BF00FF
Hot Magenta #FF00CC
Neon Carrot #FFA343
Chartreuse Yellow #DFFF00
Shocking Pink #FC0FC0
Nombre Código Hex
Screamin' Green #66FF66
Purple Pizzazz #FE4EDA
Electric Violet #8B00FF
Sunglow #FFCC33
Electric Lime #CCFF00
Snowy Mint #D6FFDB
Flamingo Pink #FF66FF
Infra Red #FF496C
Laser Lemon #FFFF66
Phlox #DF00FF
Veronica #A020F0


Existen diversas herramientas en línea de las cuales le pueden servir de apoyo para encontrar el color apropiado.

Color y accesibilidad

A pesar de que se quiera ser creativo a la hora de elegir un color y mejorar la apariencia de la wiki, es importante recordar que no todos perciben los colores de la misma manera. Mantener tu wiki accesible al daltonismo o con complicaciones visuales es también importante.

Los contrastes fuertes pueden ser considerados "dolorosos" de ver y es recomendado evitarlos. Un sitio web útil para revisarlo es la prueba de contraste.

Referencias

  1. HTML 4.01 Specification section 6.5 "Colors"
  2. W3C TR CSS3 Color Module, SVG color keywords
  3. W3C TR SVG 1.0, recognized color keyword names

Véase también

Ayuda y comentarios

El contenido de la comunidad está disponible bajo CC-BY-SA a menos que se indique lo contrario.