TailwindCSS is the utility class CSS toolkit taking the world by storm. With TailwindCSS you can easily style and theme your site with a rich set of palettes, standardized sizes and design elements.

Tailwind works out of the box with Svekyll. And, TailwindCSS is smart enough to strip out unused classes when they are not used, so if you don’t use TailwindCSS on your blog, you don’t pay for it in loading times.

To style Svekyll, add to the user.css file.

(Svekyll styling and structure is contained in the svekyll.css file. This file should not be changed to avoid upstream merge conflicts.)

You can override anything in the svekyll.css file by putting it into the user.css file.

You can, of course, use normal CSS. And, with the @apply directive from Tailwind you can use pure utility classes.

Give TailwindCSS a try and we think you will find it an impressive design system.

.svekyll-navbar-header {
    @apply p-8
    rounded-lg
    my-8
    bg-gray-100;
}

.svekyll-navbar-links {
    @apply text-sm;
}

Also, make sure you review DaisyUI and the powerful themes supported in Svekyll.