ui

Provide Starlight and Astro documentation site contribution guidelines.

1|Updated Mar 12, 2026
One-click install
npx skills add https://github.com/agentglass/claude-trace --skill ui-agentglass
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui
Source: https://github.com/agentglass/claude-trace/tree/main/.claude-plugin/skills/ui
Command: npx skills add https://github.com/agentglass/claude-trace --skill ui-agentglass

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) and assets (resource) components.

What problem does it solve?

This Skill provides comprehensive context and guidance for contributing to and understanding the Starlight and Astro documentation site, ensuring consistency and clarity for all contributors.

Core Features & Use Cases

  • Project Structure Guidance: Details the expected layout of the documentation site.
  • Page Content Requirements: Specifies the mandatory content and structure for every documentation page.
  • Component Usage: Explains how to use Starlight components like Tabs, Aside, and custom components like TraceViewer and SemconvBrowser.
  • Development Workflow: Outlines the steps for setting up the development environment, building, and deploying the documentation site.
  • Use Case: A new contributor needs to add a page explaining a new feature. They can consult this Skill to understand where to place the file, what frontmatter is required, and how to structure the content using Starlight components.

Quick Start

Consult the documentation philosophy section to understand the guiding principles for creating new documentation pages.

Frequently Asked Questions about ui

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I structure a new documentation page for an Astro Starlight site?

To structure a new documentation page for Astro Starlight, you must place the file in the correct project directory, include the mandatory frontmatter, and format the content using required Starlight components. This ensures adherence to documentation standards and maintainability.

What are the required content guidelines for contributing to Astro documentation?

Required Astro documentation content guidelines mandate specific page structures, mandatory frontmatter, and the correct usage of Starlight components like Tabs and Aside. Following these guidelines ensures clarity and consistency for all project contributors.

How do I use Starlight components like Tabs and Aside in MDX files?

To use Starlight components in MDX files, you import components like Tabs, Aside, TraceViewer, or SemconvBrowser directly into your MDX document. This component usage pattern facilitates structured content and interactive documentation elements.

What is the expected project structure for a Starlight documentation site?

The expected Starlight project structure dictates a specific layout for documentation files, assets, and references. Understanding this project structure layout is essential for placing files correctly and maintaining site organization during contributions.

How do I set up the development workflow for building and deploying Starlight documentation?

Setting up the Starlight development workflow involves configuring your local environment, running the build process, and deploying the Astro site. The workflow outlines specific steps for development setup to ensure successful local testing and deployment.

Can I use custom components like TraceViewer in my Astro MDX documentation?

Yes, you can use custom components like TraceViewer and SemconvBrowser in your Astro MDX documentation. The Skill details how to implement these custom components alongside standard Starlight elements to enhance page interactivity and functionality.