skills.rest
anavvanzin
anavvanzinCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

agency-ui-designer

Design scalable UI design systems with tokens, components, and WCAG AA accessibility.

Updated Apr 15, 2026
Search Tags:#branding#ui#accessibility#handoff#tokens#design-system#component-library
One-click install
npx skills add https://github.com/anavvanzin/Research --skill agency-ui-designer-anavvanzin
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: agency-ui-designer
Source: https://github.com/anavvanzin/Research/tree/main/cowork/integrations/antigravity/agency-ui-designer
Command: npx skills add https://github.com/anavvanzin/Research --skill agency-ui-designer-anavvanzin

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Design teams need scalable, consistent, and accessible UI systems to ship brands quickly while maintaining quality and accessibility.

Core Features & Use Cases

  • Design token system for colors, typography, spacing, and motion that enables cross-platform consistency.
  • Fully documented component library with variations, states, and usage guidelines for developers.
  • Accessibility-first mindset with WCAG AA compliance, keyboard navigation, and color-contrast standards.
  • Developer handoff artifacts, including specs, assets, and token mappings to streamline implementation.

Quick Start

Create a scalable, accessible UI design system blueprint for a new brand, including tokens, components, and developer handoff assets.

Frequently Asked Questions about agency-ui-designer

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

FAQPage Schema
How do I create a scalable UI design system that ensures brand consistency across web and mobile interfaces?▼

You build a scalable UI design system by defining a token architecture for colors, typography, spacing, and motion, then mapping those tokens to a fully documented component library for web and mobile interfaces.

What is a design token system and how does it enable cross-platform consistency?▼

A design token system is a centralized architecture storing visual design attributes like colors, typography, and spacing as data, enabling cross-platform consistency by translating seamlessly across web and mobile environments.

How do I document a component library with usage guidelines and developer handoff artifacts?▼

Document a component library by defining component variations and states, establishing usage guidelines, and generating precise developer handoff artifacts including specs, assets, and token mappings.

Can I use this approach to build a UI system that meets WCAG AA accessibility and keyboard navigation standards?▼

Yes, the approach applies an accessibility-first mindset to UI design, ensuring WCAG AA compliance, color-contrast standards, and keyboard navigation are integrated directly into the component library.

What's the best way to structure developer handoff artifacts for a cross-platform design system?▼

The best way to structure developer handoff artifacts is to generate precise implementation specs, export necessary assets, and provide explicit token mappings to streamline cross-platform development.

Related Skills

Explore More Design & Creative Skills→
docaohieu2808docaohieu2808

design

Orchestrate design tasks across brand identity, design tokens, and UI styling.

Community
Advanced
ydnikolaevydnikolaev
8

ux-designer

Build cohesive design systems and token libraries for web and mobile projects.

Community
Intermediate
aaronbassettaaronbassett
4

flutter-core:flutter-ui-widgets

Provide a structured library of Flutter UI widgets for consistent layouts.

Community
Intermediate
jasonmichaelbell78-creatorjasonmichaelbell78-creator

ui-design-system

Generate design tokens and document components for scalable UI systems.

Community
Advanced