Build Frontend

SkillMedia

Build or modify frontend interfaces using repository-native components while preserving accessibility, responsive behavior, state handling, and visual verification. Use for UI features, design implementation, forms, client-side defects, and frontend refactors; do not use for backend-only or infrastructure-only work.

Use Build Frontend in Claude, ChatGPT or Ahel Desktop

Free. Sign in, add Build Frontend and connect your AI. About a minute.

Also: Claude Code · Cursor · Codex

Then ask your AI: use the Build Frontend skill

Details

Instructions available. Your AI can read the instructions. Execution depends on the setup they require.

Add ahel to your AI once: Claude, ChatGPT, Cursor, Claude Code or Codex. Then ask it to use this.

Build FrontendStart free

What this skill tells your AI

The instructions your AI receives, as published by hashgraph-online/awesome-codex-plugins in plugins/Phelan164/codex-howto/skills/build-frontend/SKILL.md and read by ahel’s review.

Domain contract

  • Preserve the project’s framework, styling system, and component conventions.
  • Do not invent API response fields or silently change backend contracts.
  • Do not replace an established design system with custom one-off styling.
  • Define loading, empty, error, success, and disabled states that the changed flow can reach.
  • Keep semantic HTML, keyboard navigation, focus behavior, labels, and contrast in scope.
  • Avoid speculative shared abstractions for a single component.
  • Treat screenshots and mockups as visual references, not proof of interaction behavior.
  • Do not claim visual verification unless the UI was rendered or inspected.

Execute and verify

Read references/verification.md for UI, accessibility, responsive, and browser verification. Load it when the task changes rendered behavior or interaction.

Reuse existing components and tokens, implement the smallest coherent change, and prove behavior at the lowest useful layer. Prefer:

component test → feature test → type/lint → build → visual/interaction check

If a command cannot run, report the exact blocker and what remains unverified.

Signals

GitHub stars
1k
Forks
316
Last commit
Oct 2026
Advanced
Item type
skill
Key
build-frontend
Source
github.com/hashgraph-online/awesome-codex-plugins