tailwind-dark-aware

GitHub

Divide colour

divide-red-700 dark:divide-red-300
hello
world
this
is
flexbox
divide-daw-red-700
hello
world
this
is
flexbox

Border colour

border-red-700 dark:border-red-300
border-daw-red-700

Background colour

bg-red-200 dark:bg-red-800
bg-daw-red-200

Gradient colour

from-red-200 via-green-200 to-blue-200 dark:from-red-800 dark:via-green-800 dark:to-blue-800
from-daw-red-200 via-daw-green-200 to-daw-blue-200

Gradient colour (with transparency)

from-red-200 dark:from-red-800
from-daw-red-200

SVG fill colour

fill-red-200 dark:fill-red-800
fill-daw-red-200

SVG stroke colour

stroke-red-700 dark:stroke-red-300
stroke-daw-red-700

Text colour

text-red-700 dark:text-red-300
hello world
text-daw-red-700
hello world

Text decoration colour

decoration-red-700 dark:decoration-red-300
hello world
decoration-daw-red-700
hello world

Placeholder colour

placeholder-red-700 dark:placeholder-red-300
placeholder-daw-red-700

Caret colour

caret-red-700 dark:caret-red-300
caret-daw-red-700

Accent colour

accent-red-700 dark:accent-red-300
accent-daw-red-700

Box shadow colour

shadow-red-200 dark:shadow-red-800
shadow-daw-red-200

Outline colour

outline-red-700 dark:outline-red-300
outline-daw-red-700

Ring colour and ring offset colour

ring-red-700 ring-offset-blue-700 dark:ring-red-300 dark:ring-offset-blue-300
ring-daw-red-700 ring-offset-daw-blue-700