# Agent Isles Component Authoring

> Author Agent Isles Markdown with supported <agent-*> islands, readable source, and explicit security boundaries.

- Skill: `zpyoung/agent-isles-component-authoring` (Agent Skill)
- Install (CLI): `npx skillmds@latest add zpyoung/agent-isles-component-authoring`
- Raw SKILL.md: https://api.skillmd.com/api/skills/zpyoung/agent-isles-component-authoring/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: zpyoung (https://skillmd.com/u/zpyoung)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/zpyoung/agent-isles-component-authoring

---


Use this skill when the user wants help writing Agent Isles Markdown, choosing components, or converting a report into semantic islands. If the user wants to create or modify a Component Pack itself, use `agent-isles-component-pack-authoring` instead.

## Authoring principles

- Keep the Markdown source readable first. Use normal headings, prose, lists, and tables wherever they are enough.
- Use Bootstrap classes for one-off layout that does not need reusable semantics.
- Use `<agent-*>` islands for repeated report patterns: decisions, risks, metrics, dependency maps, Gantt schedules, status boards, KPIs, copy blocks, tabs, timelines, and component packs.
- Keep nested custom-element HTML blocks continuous. Blank lines inside nested custom-element structures can close CommonMark raw HTML blocks and cause later tags to render as escaped code.
- Name the trust boundary before rendering:
  - trusted mode for authored/reviewed Markdown,
  - sanitized mode for untrusted or mixed-trust Markdown.

## Useful references

- Component vocabulary: `docs/component-vocabulary.md`
- Component packs: `docs/component-packs.md`
- Demo source: `examples/demo.md`
- Security modes: README section "Security modes"

## Verification

After authoring, run a render smoke check and inspect the generated HTML for component bundle/theme references plus the specific component tags you used.