skills.rest
BekhruzTursunboev
BekhruzTursunboevCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

bexa

Enforce design rules for frontend UI code generation.

7|2|Updated Apr 28, 2026
Search Tags:#typography#accessibility#frontend#ui-design#design-systems#color-system
One-click install
npx skills add https://github.com/BekhruzTursunboev/Bexa-professional-frontend-design-skills-for-ai-agents --skill bexa
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: bexa
Source: https://github.com/BekhruzTursunboev/Bexa-professional-frontend-design-skills-for-ai-agents/tree/main/skills/bexa
Command: npx skills add https://github.com/BekhruzTursunboev/Bexa-professional-frontend-design-skills-for-ai-agents --skill bexa

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Professional frontend code produced by AI often defaults to generic UIs. This skill enforces a high-quality, non-generic visual system and design grammar that production teams trust.

Core Features & Use Cases

  • Comprehensive design system guidance including typography, color, layout, motion, and accessibility.
  • Works across web apps, dashboards, marketing sites, portfolios, and editorial content.
  • Provides deterministic guidelines that can be loaded into the AI agent to shape output in real-time.

Quick Start

Place SKILL.md at the project root and instruct your AI agent to apply Forge's professional frontend design rules to every UI write.

Frequently Asked Questions about bexa

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

FAQPage Schema
How do I make AI-generated frontend UI code look professional instead of generic?▼

To make AI-generated frontend UI look professional, encode a high-quality visual design grammar covering typography, color, layout, motion, and accessibility rules into the AI agent's context to shape real-time output.

What design system rules should I apply to AI-coded SaaS dashboards?▼

For AI-coded SaaS dashboards, apply deterministic design system rules covering identity contracts, architecture defaults, typography, color systems, layout, motion, and accessibility to ensure production-ready interfaces.

Can I use a design system skill to enforce accessibility in AI web apps?▼

Yes, you can enforce accessibility in AI web apps by loading deterministic design system guidelines that include accessibility standards and quality gates directly into the AI agent's processing context.

How do I set up design grammar guidelines for an AI coding agent?▼

To set up design grammar guidelines for an AI coding agent, place the SKILL.md file at your project root and instruct the agent to apply the professional frontend design rules to every UI write.

Does this approach work for editorial publications and marketing sites?▼

Yes, this approach works for editorial publications and marketing sites by applying the same comprehensive design system guidance and identity contracts across web apps, dashboards, portfolios, and editorial content.

Related Skills

Explore More Design & Creative Skills→
az9713az9713

dark-code-suite-init

Initialize a project with dark code prevention directories, CLAUDE.md section, and baseline audit.

Community
Intermediate
Adrian-opoAdrian-opo

product-frontend-design

Craft production-grade frontend designs for SaaS marketing sites and web apps.

Community
Advanced
christopheraaronhoggchristopheraaronhogg

aholiab-ui

Identify UI design quality issues and AI-generated slop in interfaces.

Community
Advanced
act70255act70255

frontend-design

Design distinctive frontend interfaces with intentional design systems and functional code.

Community
Advanced