Skip to content

Getting Started

Install

Shell
composer require tailwindphp/tailwindphp

TailwindPHP needs PHP 8.2 or later with the ctype and mbstring extensions, and Composer. Both extensions ship with most PHP builds and official Docker images; composer.json does not list them yet (#11), so a build without them installs the package and fails at runtime. There is no Node.js dependency, no build step, and no npm in your Docker image or CI. Just composer require and call the API.

Generate your first CSS

PHP
<?php

require __DIR__ . '/vendor/autoload.php';

use TailwindPHP\tw;

$css = tw::generate('<div class="flex items-center p-4 bg-blue-500">Hello</div>');

generate() scans the markup, extracts the class names it finds, and emits only the CSS those classes need — nothing more. With no second argument it uses a default @import "tailwindcss", which pulls in the theme, Preflight, and the utilities layer.

Customize via a CSS string

Pass an input CSS string as the second argument to add @theme variables, custom rules, or directives. New theme values become utilities automatically:

PHP
use TailwindPHP\tw;

$css = tw::generate(
    '<div class="bg-brand p-4">Hello</div>',
    '@import "tailwindcss"; @theme { --color-brand: #3b82f6; }'
);
// .bg-brand now resolves to var(--color-brand)

See Theme for the full set of theme namespaces.

Array input

For anything beyond a one-liner, pass an array with content and css keys. This is the place to define components with @apply:

PHP
use TailwindPHP\tw;

$css = tw::generate([
    'content' => '<div class="flex p-4 btn">Hello</div>',
    'css' => '
        @import "tailwindcss";

        @theme {
            --color-brand: #3b82f6;
            --font-heading: "Inter", sans-serif;
        }

        .btn {
            @apply px-4 py-2 rounded-lg bg-brand text-white;
        }
    ',
]);

The array form also accepts minify, importPaths, cache, and cacheTtl. See Usage for the input formats and Directives for @apply, @theme, @utility, and friends.

Write to a file

generate() returns a string, so writing a stylesheet is a one-liner:

PHP
use TailwindPHP\tw;

file_put_contents('dist/styles.css', tw::generate([
    'content' => file_get_contents('templates/page.html'),
    'css' => '@import "tailwindcss";',
]));

For file-based builds that scan a template directory, and for watch mode, use the CLI instead. It takes the @tailwindcss/cli build options, but its content scanning differs from Tailwind's today; the CLI page lists what it scans.

Minify for production

Pass minify => true to compress the output during generation, or call tw::minify() on an existing string:

PHP
use TailwindPHP\tw;

// Minify during generation
$css = tw::generate([
    'content' => '<div class="flex p-4">Hello</div>',
    'minify' => true,
]);

// Or minify separately
$css = tw::generate('<div class="flex p-4">Hello</div>');
$minified = tw::minify($css);

The minifier removes comments, collapses whitespace, shortens hex colors (#ffffff to #fff), and strips units from zero values (0px to 0). See Caching & minification for caching options.

Next steps

  • Usage — the generate workflow, content scanning, and input formats.
  • Class utilities — cn(), merge(), join(), and variants().
  • Plugins — typography, forms, and custom plugins.
  • API — the full tw surface and reusable compiler instances.
  • CLI — file-based and watch builds without Node.js.