CDN Assets - Espresso Enchanters

Base URL: https://cdn.enchanters.dev

OG Image

OG Image
og-image.jpg
Descargar

Icono

Icono 1
icono-espresso-enchanters-1.png
Descargar
Icono 2
icono-espresso-enchanters-2.png
Descargar
Icono 3
icono-espresso-enchanters-3.png
Descargar
Icono 4
icono-espresso-enchanters-4.png
Descargar
Icono 5
icono-espresso-enchanters-5.png
Descargar
Icono 6
icono-espresso-enchanters-6.png
Descargar
Icono 7
icono-espresso-enchanters-7.png
Descargar
Icono 8
icono-espresso-enchanters-8.png
Descargar
Icono 9
icono-espresso-enchanters-9.png
Descargar
Icono 10
icono-espresso-enchanters-10.png
Descargar
Icono 11
icono-espresso-enchanters-11.png
Descargar

Letras

Letras 1
letras-espresso-enchanters-1.png
Descargar
Letras 2
letras-espresso-enchanters-2.png
Descargar
Letras 3
letras-espresso-enchanters-3.png
Descargar
Letras 4
letras-espresso-enchanters-4.png
Descargar
Letras 5
letras-espresso-enchanters-5.png
Descargar
Letras 6
letras-espresso-enchanters-6.png
Descargar
Letras 7
letras-espresso-enchanters-7.png
Descargar

Logotipo

Logotipo 1
logotipo-espresso-enchanters-1.png
Descargar
Logotipo 2
logotipo-espresso-enchanters-2.png
Descargar
Logotipo 3
logotipo-espresso-enchanters-3.png
Descargar
Logotipo 4
logotipo-espresso-enchanters-4.png
Descargar
Logotipo 5
logotipo-espresso-enchanters-5.png
Descargar
Logotipo 6
logotipo-espresso-enchanters-6.png
Descargar
Logotipo 7
logotipo-espresso-enchanters-7.png
Descargar
Logotipo 8
logotipo-espresso-enchanters-8.png
Descargar
Logotipo 9
logotipo-espresso-enchanters-9.png
Descargar
Logotipo 10
logotipo-espresso-enchanters-10.png
Descargar
Logotipo 11
logotipo-espresso-enchanters-11.png
Descargar

Tipografias

Bricolage Grotesque
Uso: Titulos
Host Grotesk
Uso: Cuerpo

Colores

Paleta completa en Coolors.co

Principales

Midnight Blue
RGB (45, 27, 105)
Turquoise
RGB (0, 212, 170)

Secundarios

Light Red
RGB (255, 107, 107)

Apoyo

Pure White
RGB (255, 255, 255)
Charcoal
RGB (44, 62, 80)
Light Gray
RGB (248, 249, 250)
CSS Variables
CSS HEX
--midnight-blue: #2d1b69ff;
--turquoise: #00d4aaff;
--light-red: #ff6b6bff;
--white: #ffffffff;
--charcoal: #2c3e50ff;
CSS HSL
--midnight-blue: hsla(254, 59%, 26%, 1);
--turquoise: hsla(168, 100%, 42%, 1);
--light-red: hsla(0, 100%, 71%, 1);
--white: hsla(0, 0%, 100%, 1);
--charcoal: hsla(210, 29%, 24%, 1);
SCSS HEX
$midnight-blue: #2d1b69ff;
$turquoise: #00d4aaff;
$light-red: #ff6b6bff;
$white: #ffffffff;
$charcoal: #2c3e50ff;
SCSS HSL
$midnight-blue: hsla(254, 59%, 26%, 1);
$turquoise: hsla(168, 100%, 42%, 1);
$light-red: hsla(0, 100%, 71%, 1);
$white: hsla(0, 0%, 100%, 1);
$charcoal: hsla(210, 29%, 24%, 1);
SCSS RGB
$midnight-blue: rgba(45, 27, 105, 1);
$turquoise: rgba(0, 212, 170, 1);
$light-red: rgba(255, 107, 107, 1);
$white: rgba(255, 255, 255, 1);
$charcoal: rgba(44, 62, 80, 1);
SCSS Gradients
$gradient-top: linear-gradient(0deg, #2d1b69ff, #00d4aaff, #ff6b6bff, #ffffffff, #2c3e50ff);
$gradient-right: linear-gradient(90deg, #2d1b69ff, #00d4aaff, #ff6b6bff, #ffffffff, #2c3e50ff);
$gradient-bottom: linear-gradient(180deg, #2d1b69ff, #00d4aaff, #ff6b6bff, #ffffffff, #2c3e50ff);
$gradient-left: linear-gradient(270deg, #2d1b69ff, #00d4aaff, #ff6b6bff, #ffffffff, #2c3e50ff);
$gradient-top-right: linear-gradient(45deg, #2d1b69ff, #00d4aaff, #ff6b6bff, #ffffffff, #2c3e50ff);
$gradient-bottom-right: linear-gradient(135deg, #2d1b69ff, #00d4aaff, #ff6b6bff, #ffffffff, #2c3e50ff);
$gradient-top-left: linear-gradient(225deg, #2d1b69ff, #00d4aaff, #ff6b6bff, #ffffffff, #2c3e50ff);
$gradient-bottom-left: linear-gradient(315deg, #2d1b69ff, #00d4aaff, #ff6b6bff, #ffffffff, #2c3e50ff);
$gradient-radial: radial-gradient(#2d1b69ff, #00d4aaff, #ff6b6bff, #ffffffff, #2c3e50ff);
Code Snippets
Tailwind Config
{ 'midnight_blue': { DEFAULT: '#2d1b69', 100: '#090515', 200: '#120b2a', 300: '#1b103f', 400: '#241654', 500: '#2d1b69', 600: '#472ba5', 700: '#6a4bd1', 800: '#9c87e0', 900: '#cdc3f0' }, 'turquoise': { DEFAULT: '#00d4aa', 100: '#002b22', 200: '#005645', 300: '#008167', 400: '#00ab89', 500: '#00d4aa', 600: '#12ffd0', 700: '#4effdc', 800: '#89ffe7', 900: '#c4fff3' }, 'light_red': { DEFAULT: '#ff6b6b', 100: '#480000', 200: '#910000', 300: '#d90000', 400: '#ff2323', 500: '#ff6b6b', 600: '#ff8989', 700: '#ffa6a6', 800: '#ffc4c4', 900: '#ffe1e1' }, 'white': { DEFAULT: '#ffffff', 100: '#333333', 200: '#666666', 300: '#999999', 400: '#cccccc', 500: '#ffffff', 600: '#ffffff', 700: '#ffffff', 800: '#ffffff', 900: '#ffffff' }, 'charcoal': { DEFAULT: '#2c3e50', 100: '#090c10', 200: '#111820', 300: '#1a252f', 400: '#23313f', 500: '#2c3e50', 600: '#476481', 700: '#698bac', 800: '#9bb1c8', 900: '#cdd8e3' } }
CSV
2d1b69,00d4aa,ff6b6b,ffffff,2c3e50
With #
#2d1b69, #00d4aa, #ff6b6b, #ffffff, #2c3e50
Array
["2d1b69","00d4aa","ff6b6b","ffffff","2c3e50"]
Object
{"Midnight blue":"2d1b69","Turquoise":"00d4aa","Light red":"ff6b6b","White":"ffffff","Charcoal":"2c3e50"}
Extended Array
[{"name":"Midnight blue","hex":"2d1b69","rgb":[45,27,105],"cmyk":[57,74,0,59],"hsb":[254,74,41],"hsl":[254,59,26],"lab":[17,31,-43]},{"name":"Turquoise","hex":"00d4aa","rgb":[0,212,170],"cmyk":[100,0,20,17],"hsb":[168,100,83],"hsl":[168,100,42],"lab":[76,-53,9]},{"name":"Light red","hex":"ff6b6b","rgb":[255,107,107],"cmyk":[0,58,58,0],"hsb":[0,58,100],"hsl":[0,100,71],"lab":[64,56,29]},{"name":"White","hex":"ffffff","rgb":[255,255,255],"cmyk":[0,0,0,0],"hsb":[0,0,100],"hsl":[0,0,100],"lab":[100,0,0]},{"name":"Charcoal","hex":"2c3e50","rgb":[44,62,80],"cmyk":[45,22,0,69],"hsb":[210,45,31],"hsl":[210,29,24],"lab":[25,-2,-13]}]
XML
<palette>
  <color name="Midnight blue" hex="2d1b69" r="45" g="27" b="105" />
  <color name="Turquoise" hex="00d4aa" r="0" g="212" b="170" />
  <color name="Light red" hex="ff6b6b" r="255" g="107" b="107" />
  <color name="White" hex="ffffff" r="255" g="255" b="255" />
  <color name="Charcoal" hex="2c3e50" r="44" g="62" b="80" />
</palette>