Back to Devoured - September 04, 2026
DEVOURED
No-Build Tailwind (Website)

No-Build Tailwind (Website)

Design frontendcss Curlwind
Curlwind is a no-build service that serves custom, on-demand Tailwind CSS stylesheets via URL parameters.
What: Created by Steve Bauman, the tool generates minified Tailwind stylesheets containing only specified utilities, which are then cached indefinitely for performance.
Why it matters: This represents a shift toward just-in-time styling for developers who want the benefits of a utility-first framework without managing complex build pipelines or large global CSS files.
Takeaway: Test your specific utility requirements by updating your link tag to 'https://cdn.curlwind.com?classes=utility-name'.
Deep dive
  • Provides on-demand Tailwind CSS generation via query parameters.
  • Supports specific utility filtering, variant generation, and plugin configuration.
  • Offers options to toggle Preflight CSS, minification, and utility prefixing.
  • Caches generated files indefinitely to improve load speeds.
  • Intended to eliminate the need for local Tailwind build steps.
Decoder
  • Tailwind CSS: A utility-first CSS framework that provides low-level utility classes to build custom designs directly in your markup.
  • Preflight: A base set of CSS rules in Tailwind that normalizes styles across browsers.
  • No-build: A workflow where assets are delivered or processed at runtime rather than during a local compilation phase.
Original article

No-build Tailwind.

Get the CSS utilities you want. Nothing you don't.

Curlwind allows you to generate Tailwind stylesheets on demand to get only the CSS utilities you need. Generated stylesheets are cached indefinitely so your site stays fast.

Insert Link

Add the stylesheet tag to your site's head tag.

<!DOCTYPE html>
<html lang="en">
    <head>
        <link rel="stylesheet" href="https://cdn.curlwind.com">
    </head>
    <body>
        <!-- ... -->
    </body>
</html>

Attach Classes

Attach the 'classes' query parameter to URL receive a stylesheet with only the classes you need. Use wildcards to match multiple classes.

<link rel="stylesheet" href="https://cdn.curlwind.com?classes=p-*,m-*">

Receive Stylesheet

The generated stylesheet will contain only the classes you need.

/* output.css */
.p-0 {
    padding: 0px;
}
.p-1 {
    padding: 0.25rem;
}
/* ... */
.m-0 {
    margin: 0px;
}
.m-1 {
    margin: 0.25rem;
}
/* ... */

Generate Variants

Insert a colon (:) after the class name to generate variants.

<link rel="stylesheet" href="https://cdn.curlwind.com?classes=p-*:sm|md,m-*:hover">

Exclude Preflight

Generate stylesheets without Tailwind's Preflight CSS.

<link rel="stylesheet" href="https://cdn.curlwind.com?preflight=0">

Prefixed Utilities

Generate utility classes with a prefix.

<link rel="stylesheet" href="https://cdn.curlwind.com?prefix=tw">

Unminified CSS

Generate stylesheets unminified.

<link rel="stylesheet" href="https://cdn.curlwind.com?minify=0">

Enable Plugins

Generate stylesheets with built-in Tailwind plugins enabled.

<link rel="stylesheet" href="https://cdn.curlwind.com?plugins=forms,typography,aspect-ratio,container-queries">
Explore all 57 articles in today's digest

Fresh dev news, AI-digested daily. Never miss a trend at devoured.fyi