daisyFT
On this page Overview

Getting Started with DaisyFT

Learn how to integrate DaisyUI into your FastHTML projects with these simple methods.

Choose the method that works best for your workflow.

Overview

DaisyFT extends DaisyUI, TailwindCSS, and FastHTML to help you build modern websites in Python. There are three main ways to integrate DaisyFT into your projects:

  • Using the DaisyFT CLI - recommended for most projects
  • Manual Setup - download and configure the executables directly
  • CDN Integration - quick inclusion for simple projects

Method 1: DaisyFT CLI

The DaisyFT CLI provides the easiest way to get started with DaisyFT. It handles downloading executables, project creation, CSS building, and development workflow automation.

The CLI automagically creates an opinionated project template:

my-project/
├── main.py              # Main FastHTML application
├── daisyft.toml         # DaisyFT configuration
├── static/              # Static assets
│   │   ├── css/             # CSS files
│   │   │   ├── input.css    # Tailwind/DaisyUI input
│   │   │   └── output.css   # Generated CSS
│   │   └── js/              # JavaScript files
│   └── components/          # FastHTML components
View the DaisyFT repo on GitHub

Have a better template idea? We welcome contributions! Submit a PR to the repository with your template suggestion.

If you find DaisyFT useful, please consider starring the repository to help others discover it.

1

Install the DaisyFT CLI

First, install the DaisyFT CLI:

pip install daisyft
2

Initialize a new project

Create a new DaisyFT project:

daisyft init
3

Run the application

Choose one of these commands to run your application:

# Option 1: Build CSS once and run your app
daisyft run

# Option 2: Start development server with live reloading
daisyft dev

Configuration File:

When you initialize a project, a daisyft.toml configuration file is created where you can customize your project settings:

  • Server settings like port and host
  • CSS input/output paths in the paths section

Additional CLI Commands:

  • daisyft build - Build optimized CSS for production
  • daisyft sync - Update Tailwind binary and configuration
  • daisyft init --advanced - Initialize with more configuration options

Method 2: Manual Setup

This approach involves manually downloading the TailwindCSS + DaisyUI bundle and configuring it in your project. Use this method when you need more control over the setup process or when working in environments where the CLI cannot be installed.

View the FastWindCSS repo on GitHub

The repository includes pre-built executables for all major platforms with DaisyUI integrated.

If you find fastwindCSS useful, please consider starring the repository to help others discover it.

1

Download the appropriate executable

Download the TailwindCSS + DaisyUI bundle for your operating system:

# For macOS ARM64 (M1/M2)
curl -sLO https://github.com/banditburai/fastwindcss/releases/latest/download/tailwindcss-macos-arm64

# For macOS x64 (Intel)
curl -sLO https://github.com/banditburai/fastwindcss/releases/latest/download/tailwindcss-macos-x64

# For Linux x64
curl -sLO https://github.com/banditburai/fastwindcss/releases/latest/download/tailwindcss-linux-x64

# For Linux ARM64
curl -sLO https://github.com/banditburai/fastwindcss/releases/latest/download/tailwindcss-linux-arm64

# For Windows x64
curl -sLO https://github.com/banditburai/fastwindcss/releases/latest/download/tailwindcss-windows-x64.exe
2

Make the executable ready for use

Rename the file and make it executable:

# On Unix-like systems (macOS/Linux)
mv tailwindcss-* tailwindcss
chmod +x tailwindcss

# On Windows
mv tailwindcss-windows-x64.exe tailwindcss.exe
3

Create your input CSS file

Create a styles directory with an input.css file that imports TailwindCSS and DaisyUI:

mkdir -p styles
echo '@import "tailwindcss";
@plugin "daisyui";' > styles/input.css
4

Build your CSS

Generate your CSS file with the TailwindCSS executable:

# Build CSS once
./tailwindcss -i styles/input.css -o styles/output.css

# Or in watch mode (automatically rebuilds when files change)
./tailwindcss -i styles/input.css -o styles/output.css --watch

Method 3: CDN Integration

For simple projects or quick prototyping, you can use DaisyUI via CDN without any installation. This is the fastest way to get started, but offers less control than the other methods.

1

FastHTML Setup

For a FastHTML application, use the fast_app() function with DaisyUI and TailwindCSS in the headers:

from fasthtml.common import *

# Add DaisyUI and TailwindCSS via CDN
daisylink = Link(rel="stylesheet", href="https://cdn.jsdelivr.net/npm/[email protected]/daisyui.css", type="text/css")
tw_styles = Script(src="https://unpkg.com/@tailwindcss/browser@4")

# Configure your application with the CDN resources
app, rt = fast_app(
    pico=False,
    surreal=False,
    live=True,
    hdrs=(daisylink, tw_styles),
    htmlkw=dict(lang="en", dir="ltr", data_theme="dark"),
    bodykw=dict(cls="min-h-screen bg-base-100")
)

@rt("/")
def index():
    return Div(
        H1("Hello DaisyFT!", cls="text-3xl font-bold"),
        P("Your app is now using DaisyUI components with Tailwind CSS!", cls="mt-4"),
        Button("Click me", cls="btn btn-primary mt-4"),
        cls="container mx-auto p-8"
    )

if __name__ == "__main__":
    serve(reload=True, port=5001)

For more information about theming your application, check out the Themes documentation.

Next Steps

Now that you've set up DaisyFT, explore these resources to start building:

© 2025 DaisyFT