lab/tailwindcss/css-variables.html

21 lines
418 B
HTML

<link href="/tailwind.css" rel="stylesheet" />
<style>
:root {
--color-primary: blue;
--roundedness: 0;
}
[data-theme="test"] {
--color-primary: red;
--roundedness: 100%;
}
</style>
<div class="p-10 flex gap-4">
<div class="size-30 bg-(--color-primary) rounded-(--roundedness)"></div>
<div data-theme="test">
<div class="size-30 bg-(--color-primary) rounded-(--roundedness)"></div>
</div>
</div>