A Claude Code skill for building static sites with the Astro framework. It helps create Astro components and pages, set up content collections, optimize images, configure SEO, and deploy static builds.
Claude Code
$ npx -y skills add ianshk/astro-skills --agent claude-code
Codex
$ npx skills add ianshk/astro-skills -a codex
Cursor
$ npx skills add ianshk/astro-skills -a cursor
Gemini CLI
$ npx skills add ianshk/astro-skills -a gemini-cli
GitHub Copilot
$ npx skills add ianshk/astro-skills -a github-copilot
OpenCode
$ npx skills add ianshk/astro-skills -a opencode
Windsurf
$ npx skills add ianshk/astro-skills -a windsurf
An Agent Skill for building static sites with Astro. Teaches AI coding agents how to create Astro components, set up content collections, optimize images, configure SEO, and follow best practices for static site generation.
Framework-agnostic — works with React, Svelte, Vue, or any UI framework supported by Astro.
| Reference | Covers |
|---|---|
| Content Collections | Schemas (z.image, z.enum, reference()), querying, dynamic routes, entry.body |
| Image Optimization | <Image /> component, downscaling, SVG components, aspect ratios |
| SEO Checklist | Head component, per-page checklist, structured data (JSON-LD), hreflang, content rules |
| Pagination | paginate(), nested pagination, page prop |
.astro files for all presentational UI, framework components only when interactivity is neededclient:* directive that worksoutput: 'static', no SSRoutput: 'static')npx skills add ianshk/astro-skills
This installs the skill into your project and works with Claude Code, Cursor, Windsurf, Roo Code, and other Agent Skills-compatible editors.
Copy the skills/astro/ folder into your project and point your agent's skill/rules system at SKILL.md. The skill uses the open Agent Skills format and works with any compatible agent.
skills/
└── astro/
├── SKILL.md # Main skill instructions
└── references/
├── content-collections.md
├── image-optimizations.md
├── pagination.md
└── seo-checklist.md
MIT — see LICENSE.
Stars on GitHub
A development methodology for coding agents that makes the agent brainstorm before building, follow plans, run parallel work and finish branches in a disciplined way. You get fewer skipped steps and more consistent results from your coding assistant.
@obraHelps you take a change from a rough idea or bug report through to a tested, reviewed result, with each step handled by a focused skill. Its skills cover pinning down domain terms, designing module interfaces, diagnosing hard bugs, and reviewing changes against your repo's coding standards.
@mattpocockGives your coding agent a planning, testing and review routine to follow on every task. It plans before building, checks changes with tests, has a fresh reviewer look for regressions, and saves repeated wins as reusable skills.
@affaan-mDeveloper tools for working on the React codebase itself. Provides skills for extracting error messages, managing and debugging feature flags across release channels, running Flow type checks, and fixing lint and formatting issues before committing.
@facebookA Claude Code skill for building static sites with the Astro framework. It helps create Astro components and pages, set up content collections, optimize images, configure SEO, and deploy static builds. Install it with the command on its page. It includes astro. Its skills do not fire on their own yet. Free and open source.
Is this plugin yours?
Claim it with GitHubSubmit a pluginPromote it