Agent skills

Agent skills are markdown instruction files that help compatible AI coding tools work with SGDS in a more consistent way. They explain which skills to read, which components and utilities to use, how SGDS pages are structured, and which rules to follow when generating design, code, or content.

They work like task-specific guidance for your assistant. When you ask for an SGDS app, page, component, form, chart, theme, or content change, the assistant can use the relevant skill before it makes decisions.

If you are unsure where to start, begin with sgds-workflow. It maps the skill set and points the assistant to the right skill for the task.

AI assistants are strong at producing code quickly. They still need reliable context to choose the right component, utility class, token, layout, copy pattern, and implementation detail. Without that context, the output may look close while drifting from SGDS conventions.

SGDS agent skills make that context available at the point of work. They help the assistant use SGDS as the source of truth instead of inferring patterns from generic web examples.

For new applications, the workflow starts with sgds-getting-started. From there, the assistant moves between components, utilities, layouts, templates, theming, forms, data visualisation, and writing guidance based on the task.

Agent skills are plain markdown files written for AI assistants. Each skill describes when it applies, what to read next, which SGDS APIs or utilities matter, and which common mistakes to avoid.

• Workflow guidance: when to use each skill and in what order
• Setup guidance: font setup, CSS import order, component registration, and utility CSS setup
• Component and utility references: SGDS web component APIs, slots, events, and utility classes
• Layouts, blocks, and templates: app shells, page sections, full-page templates, sidebar layouts, and reusable content structures
• Task rules: instructions for forms, theming, data visualisation, writing, and common implementation checks

Agent skills are read by the assistant at query time. They do not add runtime code to your product or replace human review.

With the SGDS agent skills installed, you can describe the outcome you need and let the assistant select the relevant system guidance.

• "Set up a new Vite app with SGDS."
• "Build a sidebar dashboard layout using SGDS."
• "Choose the right SGDS spacing utility between these cards."
• "Review this form and align the validation with SGDS."
• "Rewrite this page copy using the SGDS writing guide."

The result should still be reviewed by a human. Agent skills reduce avoidable mistakes by giving the assistant clearer SGDS rules before it acts.

Agent skills guide the assistant. They do not replace product judgement, accessibility review, content review, or engineering review.

Treat AI output as a draft that starts closer to SGDS standards. Review the behaviour, visual fit, code quality, and content before shipping.