skills.rest
jay6697117
jay6697117COMMUNITY
Explore all skills by this author →
Website𝕏@nullGitHub

agency-ux-architect

Create scalable CSS design systems and layout foundations for development teams.

Updated Mar 22, 2026
Search Tags:#accessibility#design-system#responsive-design#css-grid#css-architecture#developer-handoff#ux-foundation
One-click install
npx skills add https://github.com/jay6697117/agency-agents-antigravity --skill agency-ux-architect
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: agency-ux-architect
Source: https://github.com/jay6697117/agency-agents-antigravity/tree/main/.agents/skills/agency-ux-architect
Command: npx skills add https://github.com/jay6697117/agency-agents-antigravity --skill agency-ux-architect

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill addresses the challenge of bridging project specifications and implementation by providing developers with solid CSS foundations, scalable design systems, and clear UX structure that reduce architectural ambiguity.

Core Features & Use Cases

  • CSS design systems with variables, spacing scales, typography hierarchies
  • Layout frameworks using modern Grid/Flexbox patterns
  • Component architecture, naming conventions, and accessibility considerations
  • Use Case: A team starting a new product can rely on this foundation to implement consistent styling and layout quickly.

Quick Start

Initialize the CSS design system and layout foundations for a new project by applying the provided patterns and conventions.

Frequently Asked Questions about agency-ux-architect

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

FAQPage Schema
How do I build a scalable CSS architecture for a new project?▼

To build a scalable CSS architecture, establish a design system using variables, spacing scales, and typography hierarchies to reduce ambiguity and ensure consistent styling across the project.

What is the best way to structure a responsive design system using CSS Grid?▼

A responsive design system using CSS Grid should define layout frameworks with modern patterns, component hierarchies, and responsive breakpoints to adapt interfaces across devices.

How do I ensure accessibility is included in my component architecture?▼

Ensure accessibility by enforcing accessible interactions and UX foundations within the component architecture, integrating naming conventions and accessible patterns during development.

Can I use this to generate documentation for developer handoff?▼

Yes, this approach supports developer handoff by providing production-ready CSS and UX patterns, enforcing documentation requirements alongside the design system variables.

Does this CSS architecture approach support theme support and variables?▼

Yes, this CSS architecture approach enforces theme support and utilizes design system variables to maintain consistent styling and layout foundations for development teams.

When do I need to establish UX foundations for my development team?▼

You need UX foundations when starting a new product to bridge project specifications and implementation, providing a reliable structure for consistent styling and layout.

Related Skills

Explore More Software Engineering Skills→
elihuvillarauselihuvillaraus
2

ux-architect

Generate CSS design systems and layout frameworks for web development projects.

Community
Advanced
AgLyx3AgLyx3

ui-design-system

Generate design tokens from a brand color and export them in JSON, CSS, and SCSS.

Community
Advanced
jlawsjlaws
2

agent-frontend-engineer

Design accessible, responsive UI components for frontend frameworks like React, Next.js, and Vue.

Community
Advanced
JongsixJongsix

moai-domain-uiux

Analyzes UI/UX foundations for accessible, consistent web interfaces using WCAG 2.2 and semantic tokens.

Community
Advanced