---
title: Style Guides
url: "/style/"
canonical_url: https://docs.blossom88.com/style/
markdown_url: https://docs.blossom88.com/style.md
---

# Style Guides

This documentation site uses a combination of Tailwind CSS and DaisyUI to create a beautiful and consistent user interface. Below you'll find comprehensive guides for both styling systems.

## [Tailwind CSS Guide](/style/tailwind/)

The Tailwind CSS guide demonstrates how to use utility classes to style:

- Typography (headings, paragraphs, lists)
- Layout components
- Custom components
- Responsive design
- And more...

[View Tailwind CSS Guide →](/style/tailwind/){: .btn .btn-primary}

## [DaisyUI Components](/style/daisy/)

The DaisyUI guide showcases pre-built components including:

- Buttons and form elements
- Alerts and badges
- Cards and modals
- Navigation components
- Interactive elements
- And more...

[View DaisyUI Components →](/style/daisy/){: .btn .btn-primary}

## Choosing Between Tailwind and DaisyUI

- Use **Tailwind CSS** when you need:

  - Fine-grained control over styling
  - Custom component designs
  - Utility-first approach
  - Maximum flexibility

- Use **DaisyUI** when you want:
  - Pre-built, themed components
  - Consistent design patterns
  - Rapid prototyping
  - Semantic class names

Both can be used together seamlessly, with DaisyUI components being customizable using Tailwind utilities.