Color

El uso del color en Repsol sigue unas pautas definidas por Marca, que se declinan para la correcta representación de la marca en los productos digitales de Repsol.

Descarga las paletas

Paleta cromática

Tenemos cuatro colores cromáticos primarios, seis secundarios y sus derivados, con un total de 121 colores, más 4 gradientes para usar.

Estos colores brindan flexibilidad durante el proceso de diseño, al tiempo que brindan una paleta armoniosa que se ve consistente y en línea con los estilos de nuestra la marca.

Paleta Primaria - Brand Colors

{% set colors = [ "#FE8200", "#041E42", "#FFFFFF", "#E4002B" ]%}

{% for hex in colors %} {% include 'components/color-swatch/color-swatch.njk'%} {% endfor %}

Paleta Secundaria

{% set colors = [ "#E0DED9", "#AFA8A3", "#5C4E3A", "#CCE5EA", "#00859B", "#0082BA", "#FFB81C", "#6A972C", "#000000" ]%}

{% set terciary = true %} {% for hex in colors %} {% include 'components/color-swatch/color-swatch.njk'%} {% endfor %} {% set terciary = false %}

Paleta Extendida

La paleta extendida se ha desarrollado para permitir la adaptación de la paleta cromática a la realidad constructiva de los productos digitales, de forma que se pueda aplicar más sutileza a los diseños y garantizar una acesibilidad adecuada.

Naranja Base 50 #FE8200
5#1A0D00
10#331A00
20#663400
30#994E00
40#CC6800
50#FE8200
60#FF9B33
70#FFB466
80#FFCD99
90#FFE6CC

Gris Cálido Claro Base 80 #E0DED9
5#11100E
10#2D2B25
20#49453C
30#656052
40#817A69
50#9A9483
60#B1ACA0
70#C8C4BC
80#E0DED9
90#F6F5F4

Azul Primario Base 10 #041E42
5#010913
10#041E42
20#073473
30#0D60D4
40#0D60D4
50#2279F2
60#5296F5
70#82B3F7
80#B2D0FA
90#E2EEFD

Turquesa Base 30 #00859B
5#00161A
10#002C33
20#005866
30#00859B
40#00AFCC
50#00DBFF
60#33E2FF
70#66E9FF
80#99F1FF
90#CCF8FF

Gris Cálido Medio Base 60 #AFA8A3
5#100F0E
10#2C2826
20#47423E
30#625B55
40#7D746D
50#978D87
60#AFA8A3
70#C6C1BE
80#DEDBD9
90#F6F5F4

Gris Cálido Oscuro Base 20 #5C4E3A
5#1C1812
10#3B3225
20#5C4E3A
30#7A674D
40#998261
50#AE9B7F
60#C2B39E
70#D6CCBD
80#E9E4DD
90#FDFDFC

Azul Secundario Base 30 #0082BA
5#00151F
10#003952
20#005D85
30#0082BA
40#00A4EB
50#1FBBFF
60#52CBFF
70#85DAFF
80#B8EAFF
90#EBF9FF

Rojo Base 30 #E4002B
5#1A0005
10#4D000E
20#800018
30#E4002B
40#E6002B
50#FF1A45
60#FF4D6E
70#FF8098
80#FFB3C1
90#FFE5EA

Amarillo Base 50 #FFB81C
5#1A1200
10#4D3500
20#805800
30#B37B00
40#E69E00
50#FFB81C
60#FFC74C
70#FFD77F
80#FFE7B3
90#FFF7E5

Verde Base 30 #6A972C
5#162009
10#324715
20#4E6F20
30#6A972C
40#85BE37
50#9DCF59
60#B5DA81
70#CCE6A8
80#E3F1D0
90#FAFDF7

Negro Base 5 #000000
5#000000
10#1A1A1A
20#333333
30#4D4D4D
40#666666
50#808080
60#999999
70#B3B3B3
80#CCCCCC
90#E6E6E6

Azul Claro Base 80 #CCE5EA
5#091416
10#18343A
20#27555E
30#367582
40#4496A6
50#60AEBE
60#84C0CC
70#A8D3DB
80#CCE5EA
90#F1F8F9

Instalar las paletas de color

Descarga las paletas

El sistema de diseño de Repsol dispone de las paletas de color creadas para sketch y adobe. Para instalarse las paletas en el ordenador, el proceso depende del software empleado.