JSFiddle - React, Tailwind, and code Playground

by Tan

HTML

<!-- CSS Variables -->

<div class="container">
THIS COLOUR IS BLUE
</div>


<div class="container2">
Another Div
</div>

CSS

/* CSS Variables - used to reduce data and file size if using the same code several times */

:root {
    --blue: blue;
    --moreComplex: linear-gradient(0deg, rgba(17, 25, 40, 0.44) 0%, rgba(17, 25, 40, 0.24) 50%, rgba(17, 25, 40, 0.44) 100%);
}

.container {
   color: var(--blue);
   background: var(--moreComplex);
}

.container2 {
   color: var(--blue);
   background: var(--moreComplex);
}