skills.rest
rpelizza
rpelizzaCOMMUNITY
Explore all skills by this author →
GitHub

pelizzai-frontend

Enforce contract-based frontend design with accessibility and visual verification.

Updated Jun 26, 2026
Search Tags:#accessibility#frontend#web-development#ui-design#design-system
One-click install
npx skills add https://github.com/rpelizza/PelizzAI --skill pelizzai-frontend
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: pelizzai-frontend
Source: https://github.com/rpelizza/PelizzAI/tree/main/.agents/skills/pelizzai-frontend
Command: npx skills add https://github.com/rpelizza/PelizzAI --skill pelizzai-frontend

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This skill prevents generic AI-generated interfaces and vague design direction by enforcing a strict, contract-based approach to frontend development.

Core Features & Use Cases

  • Direction Contract: Mandates concrete decisions on concept, typography, color, layout, and motion before any code is written.
  • Anti-Convergence Sortition: Uses deterministic indexing to force the AI to explore diverse design candidates rather than defaulting to common patterns.
  • Craft Floor Enforcement: Applies numeric quality standards for accessibility, spacing, and visual fidelity that must be verified in a rendered browser.

Quick Start

Ask the agent to initialize a new frontend task by creating a direction contract based on the current project requirements.

Frequently Asked Questions about pelizzai-frontend

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

FAQPage Schema
How do I prevent generic UI convergence in AI-generated frontend code?▼

A direction contract prevents generic UI by requiring concrete decisions on concept, typography, color, layout, and motion before any frontend code is written. This contract-based approach enforces design rigor and establishes numeric quality standards for accessibility and spacing.

How do I enforce accessibility standards in frontend web development?▼

You can enforce accessibility standards by applying numeric craft floors for spacing and visual fidelity that must be verified in a rendered browser. This ensures interface components meet required accessibility standards before deployment.

What is anti-convergence sortition in UI design?▼

Anti-convergence sortition uses deterministic indexing to force the AI to explore diverse design candidates rather than defaulting to common, generic UI patterns. This mechanism ensures varied interface components during the design process.

How do I start a frontend design system task using a direction contract?▼

Start by asking the agent to initialize a new frontend task, which creates a direction contract based on your current project requirements. This mandates concrete decisions on concept, typography, color, layout, and motion before any code is written.

Does this frontend design process require visual verification in a browser?▼

Yes, this frontend design process requires mandatory visual verification of all UI changes in a rendered browser. It enforces craft floors by applying numeric quality standards for accessibility, spacing, and visual fidelity.

Related Skills

Explore More Design & Creative Skills→
ydnikolaevydnikolaev
8

idea-interview

Extract project information through structured stakeholder interviews into a discovery brief.

Community
Advanced
VidyaBodepudiVidyaBodepudi
2

browser-testing-with-devtools

Inspect frontend UI rendering, responsiveness, and accessibility with browser DevTools.

Community
Intermediate
NolanPicNolanPic

Frontend Accessibility

Enforce WCAG compliance in frontend UI code with semantic HTML and ARIA.

Community
Basic
coderhormazcoderhormaz

frontend-design

Design production-grade frontend interfaces with reusable UI primitives and accessibility.

Community
Advanced