Agent skill

Astro

by devantler-tech in devantler-tech/ksail

Skill for building with the Astro web framework. An agent skill from devantler-tech/ksail.

MITAuto-check passedFrontend & Design

Install Astro

skills CLI
$ npx skills add devantler-tech/ksail --skill astro -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install devantler-tech/ksail astro --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/devantler-tech/ksail.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/astro .claude/skills/astro && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
astro
GitHub stars
166
Used in
3 other repos
Token cost
~1.1k tokens
SKILL.md length
307 words
Files
1
Skills in repo
6
Repo updated
First seen
Licence
MIT

At a glance

Skill for building with the Astro web framework. An agent skill from devantler-tech/ksail.

  • Works in 5 steps: Add the adapter: npx astro add vercel… → Run npx astro check to catch type and… → Run npx astro build to produce the… → …
  • The user needs to work with Astro
  • SKILL.md covers Quick Reference, Core Config Options, Common Workflows and Adapters, plus 1 more section
  • Calls npx

What it does

Astro is an agent skill from devantler-tech/ksail. Skill for building with the Astro web framework. Helps create Astro components and pages, configure SSR adapters, set up content collections, deploy static sites, and manage project structure and CLI commands. Use when the user needs to work with Astro, mentions .astro files, asks about static site generation (SSG), islands architecture, content collections, or deploying an Astro project.

Its SKILL.md is about 1.1k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in Frontend & Design, covering Static sites and blogs. It works with Astro. The repository describes itself as: All-in-one Kubernetes SDK: create, manage, and operate clusters across distributions (Kind, K3d, Talos, VCluster) with built-in GitOps, secrets, AI assistant, and MCP server… The licence is MIT.

When your agent uses it

  • The user needs to work with Astro
  • Mentions .astro files
  • Asks about static site generation (SSG)
  • Islands architecture

Example prompts

  • “/astro”

Requirements

  • Node.js

Workflow steps

5 steps, taken from the first numbered list in SKILL.md.

  1. Add the adapter: npx astro add vercel --yes (or node, cloudflare, netlify)
  2. Run npx astro check to catch type and configuration errors before building.
  3. Run npx astro build to produce the deployment artifact.
  4. Verify the build output directory (e.g. dist/) exists and is non-empty before proceeding.
  5. Deploy the output per the adapter's documentation.

What it can do on your machine

Read from SKILL.md and the folder at commit b3a23bc. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Shell commands in SKILL.md call:

    • npx

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    Links to these hosts (documentation or services it may open):

    • docs.astro.build
    • astro.build
    • github.com

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Astro loads about 1.1k tokens when it runs. Until then it costs about 99 tokens; SKILL.md has 307 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~99
When it runs · the whole SKILL.md, loaded when a task matches
~1.1k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from devantler-tech/ksail at commit b3a23bc, republished under its MIT licence (© devantler-tech). 307 words, ~1,085 tokens.

Download SKILL.mdSave it as .claude/skills/astro/SKILL.md (or your agent's skills folder).
name
astro
description
Skill for building with the Astro web framework. Helps create Astro components and pages, configure SSR adapters, set up content collections, deploy static sites, and manage project structure and CLI commands. Use when the user needs to work with Astro, mentions .astro files, asks about static site generation (SSG), islands architecture, content collections, or deploying an Astro project.
license
MIT
metadata.authors
Astro Team
metadata.github-path
skills/astro
metadata.github-ref
refs/heads/main
metadata.github-repo
https://github.com/astrolicious/agent-skills
metadata.github-tree-sha
81d96cec5008970ed8fbecb23f7fb48536102b84
metadata.version
0.0.1
metadata.internal
true

Astro Usage Guide

Always consult docs.astro.build for code examples and latest API.

Astro is the web framework for content-driven websites.


Quick Reference

File Location

CLI looks for astro.config.js, astro.config.mjs, astro.config.cjs, and astro.config.ts in: ./. Use --config for custom path.

CLI Commands
  • npx astro dev - Start the development server.
  • npx astro build - Build your project and write it to disk.
  • npx astro check - Check your project for errors.
  • npx astro add - Add an integration.
  • npx astro sync - Generate TypeScript types for all Astro modules.

Re-run after adding/changing plugins.

Project Structure

Reference project structure docs.

  • src/* - Project source code (components, pages, styles, images, etc.)
  • src/pages - Required. Defines all pages and routes.
  • src/components - Components (convention, not required).
  • src/layouts - Layout components (convention, not required).
  • src/styles - CSS/Sass files (convention, not required).
  • public/* - Non-code, unprocessed assets (fonts, icons, etc.); copied as-is to build output.
  • package.json - Project manifest.
  • astro.config.{js,mjs,cjs,ts} - Astro configuration file. (recommended)
  • tsconfig.json - TypeScript configuration file. (recommended)

Core Config Options

OptionNotes
siteYour final, deployed URL. Used to generate sitemaps and canonical URLs.
Example astro.config.ts
ts
import { defineConfig } from 'astro/config';

export default defineConfig({
  site: 'https://example.com',
});

Common Workflows

Creating a Basic Page

Add a file to src/pages/ — the filename becomes the route:

astro
---
// src/pages/index.astro
const title = 'Hello, Astro!';
---
<html>
  <head><title>{title}</title></head>
  <body>
    <h1>{title}</h1>
  </body>
</html>
Creating a Component
astro
---
// src/components/Card.astro
const { title, body } = Astro.props;
---
<div class="card">
  <h2>{title}</h2>
  <p>{body}</p>
</div>
Deploying with an Adapter
  1. Add the adapter: npx astro add vercel --yes (or node, cloudflare, netlify)
  2. Run npx astro check to catch type and configuration errors before building.
  3. Run npx astro build to produce the deployment artifact.
  4. Verify the build output directory (e.g. dist/) exists and is non-empty before proceeding.
  5. Deploy the output per the adapter's documentation.

Adapters

Deploy to your favorite server, serverless, or edge host with build adapters. Use an adapter to enable on-demand rendering in your Astro project.

Add Node.js adapter using astro add:

npx astro add node --yes

Add Cloudflare adapter using astro add:

npx astro add cloudflare --yes

Add Netlify adapter using astro add:

npx astro add netlify --yes

Add Vercel adapter using astro add:

npx astro add vercel --yes

Other Community adapters

Resources

© devantler-tech, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in .agents/skills/astro of devantler-tech/ksail.

Open the folder on GitHubat commit b3a23bc

Used in 3 other repositories

We found 3 copies of this SKILL.md (exact, near-identical or edited) in other folders, from 3 other GitHub owners. This page covers the copy in devantler-tech/ksail, which our catalogue first saw on October 7, 2026.

Compare with similar skills

Astro next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Astro compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Astro this skilldevantler-tech/ksail1663 repos~1.1kAutomated safety check: PassMIT
Launch With AWSaws/agent-toolkit-for-aws2.8k—~3.2kAutomated safety check: PassApache-2.0
Cloudflare Workers Frameworkssecondsky/claude-skills227—~1.4kAutomated safety check: PassMIT
Tabler Astro Dev Servertabler/tabler42k—~1.2kAutomated safety check: PassMIT
Tabler Astro Component Scriptstabler/tabler42k—~2.1kAutomated safety check: PassMIT
Kill AI Slopyetone/kill-ai-slop1.3k—~1.4kAutomated safety check: PassApache-2.0

Similar skills

  • Launch With AWS

    aws/agent-toolkit-for-aws

    Official

    Migrates vibe-coded web applications to AWS. An agent skill from aws/agent-toolkit-for-aws.

    2.8k GitHub stars~3.2k tokensUpdated today
    Frontend & DesignAuto-check passed
  • Cloudflare Workers Frameworks

    secondsky/claude-skills

    Framework integration for Cloudflare Workers. An agent skill from secondsky/claude-skills.

    227 GitHub stars~1.4k tokensUpdated 9 days ago
    Frontend & DesignAuto-check passed
  • Starts the right Tabler dev server, keeps it from clashing with builds and verifies changes in the browser before a page or component is handed back.

    42k GitHub stars~1.2k tokensUpdated today
    Frontend & DesignAuto-check passed
  • Rules for adding or fixing client-side scripts in Tabler's Astro components so the copied preview HTML stays readable, self-contained and runs in the right order.

    42k GitHub stars~2.1k tokensUpdated today
    Frontend & DesignAuto-check passed
  • Kill AI Slop

    yetone/kill-ai-slop

    Find and remove AI slop — the generic, machine-default visual and copy tics of vibe-coded products — from a web project.

    1.3k GitHub stars~1.4k tokensUpdated 22 days ago
    Frontend & DesignAuto-check passed
  • Motion Dev Animations

    199-biotechnologies/motion-dev-animations-skill

    Creates 120fps GPU-accelerated animations with Motion.dev (Framer Motion successor) for React, Next.js, Svelte, and Astro projects.

    104 GitHub starsUsed in 1 repo~2.8k tokens
    Frontend & DesignAuto-check: notes

More from devantler-tech/ksail

  • Bubbletea

    devantler-tech/ksail

    Build terminal user interfaces with Go and Bubbletea framework.

    166 GitHub stars~2.3k tokensUpdated today
    Auto-check passed
  • GitHub Actions Docs

    devantler-tech/ksail

    A skill your agent uses when users ask how to write, explain, customize, migrate, secure, or troubleshoot GitHub Actions workflows, workflow syntax, triggers, matrices, runners, reusable workflows…

    166 GitHub starsUsed in 2 repos~1.3k tokens
    Auto-check passed
  • Ksail

    devantler-tech/ksail

    Use the ksail CLI to spin up and manage Kubernetes clusters (Kind/K3d/Talos/vCluster/KWOK — local via Docker; EKS — cloud via AWS) and GitOps workloads declaratively.

    166 GitHub stars~1.1k tokensUpdated today
    Auto-check passed
  • Ways Of Working

    devantler-tech/ksail

    Codifies devantler-tech engineering practices: agent-first development workflow, TDD, CI/CD pipelines, GitHub Flow, code quality gates, and Kubernetes workflows with ksail.

    166 GitHub stars~2k tokensUpdated today
    Auto-check passed
  • Maintain

    devantler-tech/ksail

    Repository maintenance for devantler-tech/ksail — triage, bug fixes, CI/workflow health & CI-failure/flaky investigation, docs upkeep, driving every open PR (external contributions included) to a…

    166 GitHub stars~209 tokensUpdated today
    Auto-check passed

Works with

Questions about Astro

What does Astro do?

Skill for building with the Astro web framework. An agent skill from devantler-tech/ksail. Astro is an agent skill from devantler-tech/ksail. Skill for building with the Astro web framework.

When should I use Astro?

Astro fits situations like: the user needs to work with Astro; mentions .astro files; asks about static site generation (SSG); islands architecture.

How do I install Astro in Claude Code?

Run `npx skills add devantler-tech/ksail --skill astro -a claude-code`. Or copy the skill folder (.agents/skills/astro in devantler-tech/ksail) into .claude/skills/astro in your project. Claude Code loads it when a task matches its description.

How do I install Astro in Codex?

Run `npx skills add devantler-tech/ksail --skill astro -a codex`. Or copy the skill folder (.agents/skills/astro in devantler-tech/ksail) into .agents/skills/astro in your project. Codex loads it when a task matches its description.

Can I use Astro in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add devantler-tech/ksail --skill astro -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/astro, .gemini/skills/astro, .github/skills/astro and .opencode/skills/astro in your project.

What does Astro need to run?

Going by SKILL.md and its folder, Astro needs the command-line tools its instructions call (npx). Our summary lists: Node.js.

Does Astro access the network?

SKILL.md names 3 domains. As links in the text: docs.astro.build, astro.build and github.com. This is read from the text; nothing was executed.

Is Astro safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Astro use?

Astro is published under the MIT licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Astro use?

About 1.1k tokens (SKILL.md is roughly 4.3k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Astro?

Skills that share tags, products or a category with Astro: Launch With AWS (aws/agent-toolkit-for-aws, 2.8k stars), Cloudflare Workers Frameworks (secondsky/claude-skills, 227 stars), Tabler Astro Dev Server (tabler/tabler, 42k stars) and Tabler Astro Component Scripts (tabler/tabler, 42k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Astro?

devantler-tech (a GitHub organization) maintains it in devantler-tech/ksail, which has 166 GitHub stars. The repository holds 6 skills in this directory. The repository was last updated on October 7, 2026.

Source: devantler-tech/ksail on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.