How does it handle page layouts?

It follows a structured workflow using src/layouts/ as the primary directory for shared wrappers, with Layout.astro acting as the default structure.

Can I use Markdown with this skill?

Absolutely. It provides specific patterns for authoring content routes using .md files with frontmatter for titles and metadata.

Does this skill support Tailwind CSS v4?

Yes, it is specifically configured for Tailwind v4 via the @tailwindcss/vite integration for improved performance and modern CSS features.

Which package manager does this skill prefer?

The skill uses Bun for all package operations, including adding, removing, and updating dependencies, ensuring faster build and install times.

Astro & Tailwind v4 Expert

Name: Astro & Tailwind v4 Expert
Author: ZafTec

byZafTec

0•

Herramientas de Diseño

Builds and optimizes high-performance Astro websites using Tailwind CSS v4 and the Bun runtime.

This skill provides a comprehensive workflow for developing modern, static-first websites using Astro and Tailwind CSS v4. It enforces best practices for directory structure, layout management, and component architecture, specifically optimized for the Bun environment. Whether you are building complex routing systems, implementing interactive client islands, or optimizing assets with Astro's built-in tools, this skill ensures consistent implementation patterns and clean, maintainable code within the Astro ecosystem.

Características Principales

01File-based routing management in src/pages/

02Optimized image handling with astro:assets

030 GitHub stars

04Tailwind CSS v4 integration via @tailwindcss/vite

05Interactive client-side hydration patterns (Islands Architecture)

06Bun-native package management workflows

Casos de Uso

01Converting Markdown files into structured content routes

02Implementing utility-first styling using Tailwind CSS v4

03Rapidly scaffolding new Astro pages with standardized layouts

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add zaftec/zaf_tech_landing astro-tailwind-expert

For use in Claude.ai and ChatGPT

Download Skill