<h2>Lava</h2>
<p>Logo-Farbe als Richtwert für alle anderen Farben, Schmuckfarben und Schattierungen.</p>
<div class="flex flex-row gap-1">
<div class="p-2 w-48 h-48 text-white text-xs font-mono" style="background-color: #e32633">
<div>Name: Lava (light)</div>
<div>Class: lava-light</div>
<div>Hex: #e32633</div>
<div>RGB: 0, 0, 0</div>
<div>CMYK: 0, 0, 0, 0</div>
</div>
<div class="p-2 w-64 h-64 text-white text-xs font-mono font-bold" style="background-color: #c31924">
<div>Name: Lava</div>
<div>Class: lava</div>
<div>Hex: #c31924</div>
<div>RGB: 195, 25, 36</div>
<div>CMYK: 0, 87, 82, 24</div>
</div>
<div class="p-2 w-48 h-48 text-white text-xs font-mono" style="background-color: #a2151f">
<div>Name: Lava (dark)</div>
<div>Class: lava-dark</div>
<div>Hex: #a2151f</div>
<div>RGB: 0, 0, 0</div>
<div>CMYK: 0, 0, 0, 0</div>
</div>
</div>
<div class="lava-gradient p-2 mt-2 w-full h-48">
'lava-gradient' als Klasse angewendet.
Verlauf ändert sich bei Mauseover.
</div>
<h2>Lava</h2>
<p>Logo-Farbe als Richtwert für alle anderen Farben, Schmuckfarben und Schattierungen.</p>
<div class="flex flex-row gap-1">
<div class="p-2 w-48 h-48 text-white text-xs font-mono" style="background-color: {{ colors.lava.light.hex }}">
<div>Name: {{ colors.lava.light.label }}</div>
<div>Class: {{ colors.lava.light.class }}</div>
<div>Hex: {{ colors.lava.light.hex }}</div>
<div>RGB: {{ colors.lava.light.rgb }}</div>
<div>CMYK: {{ colors.lava.light.cmyk }}</div>
</div>
<div class="p-2 w-64 h-64 text-white text-xs font-mono font-bold" style="background-color: {{ colors.lava.default.hex }}">
<div>Name: {{ colors.lava.default.label }}</div>
<div>Class: {{ colors.lava.default.class }}</div>
<div>Hex: {{ colors.lava.default.hex }}</div>
<div>RGB: {{ colors.lava.default.rgb }}</div>
<div>CMYK: {{ colors.lava.default.cmyk }}</div>
</div>
<div class="p-2 w-48 h-48 text-white text-xs font-mono" style="background-color: {{ colors.lava.dark.hex }}">
<div>Name: {{ colors.lava.dark.label }}</div>
<div>Class: {{ colors.lava.dark.class }}</div>
<div>Hex: {{ colors.lava.dark.hex }}</div>
<div>RGB: {{ colors.lava.dark.rgb }}</div>
<div>CMYK: {{ colors.lava.dark.cmyk }}</div>
</div>
</div>
<div class="lava-gradient p-2 mt-2 w-full h-48">
'lava-gradient' als Klasse angewendet.
Verlauf ändert sich bei Mauseover.
</div>
{
"colors": {
"lava": {
"default": {
"label": "Lava",
"class": "lava",
"hex": "#c31924",
"rgb": "195, 25, 36",
"cmyk": "0, 87, 82, 24"
},
"light": {
"label": "Lava (light)",
"class": "lava-light",
"hex": "#e32633",
"rgb": "0, 0, 0",
"cmyk": "0, 0, 0, 0"
},
"dark": {
"label": "Lava (dark)",
"class": "lava-dark",
"hex": "#a2151f",
"rgb": "0, 0, 0",
"cmyk": "0, 0, 0, 0"
}
},
"honeyyellow": {
"default": {
"label": "Lava",
"class": "honeyyellow",
"hex": "#f6ae2d",
"rgb": "0, 0, 0",
"cmyk": "0, 0, 0, 0"
},
"light": {
"label": "Lava (light)",
"class": "honeyyellow-light",
"hex": "#f8c462",
"rgb": "0, 0, 0",
"cmyk": "0, 0, 0, 0"
},
"dark": {
"label": "Lava (dark)",
"class": "honeyyellow-dark",
"hex": "#f5a614",
"rgb": "0, 0, 0",
"cmyk": "0, 0, 0, 0"
}
},
"androidgreen": {
"default": {
"label": "Android Green",
"class": "androidgreen",
"hex": "#95c03d",
"rgb": "149, 192, 61",
"cmyk": "22, 0, 68, 25"
},
"light": {
"label": "Android Green (light)",
"class": "androidgreen-light",
"hex": "#abce64",
"rgb": "0, 0, 0",
"cmyk": "0, 0, 0, 0"
},
"dark": {
"label": "Android Green (dark)",
"class": "androidgreen-dark",
"hex": "#84ab36",
"rgb": "0, 0, 0",
"cmyk": "0, 0, 0, 0"
}
},
"onyx": {
"default": {
"label": "Onyx",
"class": "onyx",
"hex": "#3d3d3d",
"rgb": "149, 192, 61",
"cmyk": "22, 0, 68, 25"
},
"light": {
"label": "Onyx (light)",
"class": "onyx-light",
"hex": "#525252",
"rgb": "0, 0, 0",
"cmyk": "0, 0, 0, 0"
},
"dark": {
"label": "Onyx (dark)",
"class": "onyx-dark",
"hex": "#292929",
"rgb": "0, 0, 0",
"cmyk": "0, 0, 0, 0"
}
},
"queenblue": {
"default": {
"label": "Queenblue",
"class": "queenblue",
"hex": "#33658a",
"rgb": "0, 0, 0",
"cmyk": "0, 0, 0, 0"
},
"light": {
"label": "Queenblue (light)",
"class": "queenblue-light",
"hex": "#4282b3",
"rgb": "0, 0, 0",
"cmyk": "0, 0, 0, 0"
},
"dark": {
"label": "Queenblue (dark)",
"class": "queenblue-dark",
"hex": "#2c5777",
"rgb": "0, 0, 0",
"cmyk": "0, 0, 0, 0"
}
},
"darkskyblue": {
"default": {
"label": "Darkskyblue",
"class": "darkskyblue",
"hex": "#86bbd8",
"rgb": "0, 0, 0",
"cmyk": "0, 0, 0, 0"
},
"light": {
"label": "Darkskyblue (light)",
"class": "darkskyblue-light",
"hex": "#b2d4e6",
"rgb": "0, 0, 0",
"cmyk": "0, 0, 0, 0"
},
"dark": {
"label": "Darkskyblue (dark)",
"class": "darkskyblue-dark",
"hex": "#74b1d2",
"rgb": "0, 0, 0",
"cmyk": "0, 0, 0, 0"
}
},
"isabelline": {
"default": {
"label": "Isabelline",
"class": "isabelline",
"hex": "#efefea",
"rgb": "",
"cmyk": ""
}
},
"ghostwhite": {
"default": {
"label": "Ghostwhite",
"class": "ghostwhite",
"hex": "#f6f7fc",
"rgb": "",
"cmyk": ""
}
}
}
}
No notes defined.