Buio, an Astro & Tailwind CSS web3 template

Buio — Dark SaaS theme for Astro & Tailwind CSS

Buio is a bold dark-mode template crafted for Web3 teams, developer tools, and decentralized platforms. With a glowing aesthetic, sharp layouts, and clean typography, it’s designed to help complex products stand out while still inspiring clarity and trust.

Specifications

• Built with Astro v5 + Tailwind CSS v4
• High Lighthouse scores across Performance, Accessibility, Best Practices, and SEO
• Fully responsive and optimized for modern browsers

Benefits

• Multiple landing and pricing layouts, plus contact and status pages
• Content collections for blogs, changelogs, teams, customers, and more
• Reusable components (buttons, links, wrappers, typography, etc.) built with the OKLCH color system
• Built-in search powered by Fuse.js for instant in-site discovery
• Blog pagination for smooth content navigation
• SEO-ready with Astro SEO, Sitemap, and RSS integrations
• Optional animations with AOS for added motion
• Clean file structure with ongoing updates and a style guide

Optional CMS

Buio includes a preconfigured .pages.yaml file that connects your content collections directly to PagesCMS.
All integration happens automatically when you link your repo inside the PagesCMS dashboard—no changes are made to the template code. You keep a pure Astro + Tailwind CSS setup with the option to use PagesCMS anytime.

Modern color system

Buio uses OKLCH color values for its design tokens. This ensures consistent rendering across browsers, easier theming, and a future-proof approach to color management with Tailwind CSS v4.

Why choose Buio?

• Built for Web3 teams, dApps, and next-gen SaaS platforms
• Astro’s static-first architecture guarantees speed and reliability
• Tailwind utilities allow fast customization with consistent design patterns
• Component system encourages reuse and maintainability
• Dark-mode aesthetic that feels modern, premium, and performance-ready