Brand Colours

<div class="max-w-7xl mx-auto px-4 sm:px-6">

    <div class="grid grid-cols-8 gap-6 my-6">
        <div class="bg-primary aspect-square flex justify-center items-center text-light uppercase">Kinetic Green</div>
        <div class="bg-primary/60 aspect-square flex justify-center items-center text-light uppercase">60%</div>
        <div class="bg-primary/40 aspect-square flex justify-center items-center text-dark uppercase">40%</div>
        <div class="bg-primary/20 aspect-square flex justify-center items-center text-dark uppercase">20%</div>
    </div>

    <div class="grid grid-cols-8 gap-6 my-6">
        <div class="bg-secondary aspect-square flex justify-center items-center text-light uppercase">Kinetic Blue</div>
        <div class="bg-secondary/60 aspect-square flex justify-center items-center text-light uppercase">60%</div>
        <div class="bg-secondary/40 aspect-square flex justify-center items-center text-dark uppercase">40%</div>
        <div class="bg-secondary/20 aspect-square flex justify-center items-center text-dark uppercase">20%</div>
    </div>

    <hr>

    <div class="grid grid-cols-8 gap-6 my-6">
        <div class="bg-dark aspect-square flex justify-center items-center text-light uppercase">Charcoal</div>
        <div class="bg-teal aspect-square flex justify-center items-center text-light uppercase">Teal</div>
        <div class="bg-pink aspect-square flex justify-center items-center text-light uppercase">Pink</div>
        <div class="bg-purple aspect-square flex justify-center items-center text-light uppercase">Purple</div>
        <div class="bg-green aspect-square flex justify-center items-center text-light uppercase">green</div>
        <div class="bg-blue aspect-square flex justify-center items-center text-light uppercase">blue</div>
    </div>

</div>

<!-- dynamic colors -->
<div class="hidden
	bg-primary
	bg-secondary
	bg-teal
	bg-blue
	bg-green
	bg-pink
	text-primary
	text-secondary
	text-teal
	text-blue
	text-green
	text-pink
	border-primary
	border-secondary
	border-teal
	border-blue
	border-green
	border-pink
"></div>