Syntax

Grid Template Areas

Setting areas in the grid container

🚧This page is still under construction and some content may not be complete.

Overview

ClassDeclarations
grid-template-areas:valuegrid-template-areas: value;
grid-template-areas:nonegrid-template-areas: none;

Conditionally apply

Apply styles based on different states using selectors and applying conditionally.

<div class="grid-template-areas:none:hover grid-template-areas:none@sm grid-template-areas:none@dark grid-template-areas:none@print"></div>
Design Token
Colors

Customizing color variables or starting with the crafted palette.

© Aoyue Design LLC.