skills.rest
AshesOfTheUndead
AshesOfTheUndeadCOMMUNITY
Explore all skills by this author →
GitHub

modern

Generate component specifications with semantic tokens and WCAG 2.2 AA accessibility rules.

Updated Jul 9, 2026
Search Tags:#typography#accessibility#tokens#ui-ux#design-system#modern
One-click install
npx skills add https://github.com/AshesOfTheUndead/rezurxlib --skill modern-ashesoftheundead
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: modern
Source: https://github.com/AshesOfTheUndead/rezurxlib/tree/main/skills/design/design-systems/style-skills/modern
Command: npx skills add https://github.com/AshesOfTheUndead/rezurxlib --skill modern-ashesoftheundead

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill solves the challenge of maintaining visual consistency and accessibility standards across complex digital interfaces by providing a centralized, token-based design framework.

Core Features & Use Cases

  • Design Token Management: Standardizes colors, typography, and spacing using semantic tokens to ensure a cohesive look.
  • Accessibility Compliance: Enforces WCAG 2.2 AA standards through explicit focus states and contrast requirements.
  • Use Case: When building a new admin panel or dashboard, use this Skill to generate component-level rules that ensure your buttons, inputs, and modals align with the established editorial style.

Quick Start

Apply the modern design system guidelines to the current project by generating a component specification for a new navigation sidebar.

Frequently Asked Questions about modern

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

FAQPage Schema
What are semantic design tokens and how do they manage UI consistency?▼

Semantic design tokens standardize UI elements like colors, typography, and spacing. By defining these tokens centrally, a design system ensures a cohesive look and maintains visual consistency across complex digital interfaces.

How do I build an admin dashboard that meets WCAG 2.2 AA accessibility standards?▼

To build an accessible admin dashboard, apply a design system with accessibility-first interaction rules. It enforces WCAG 2.2 AA standards through explicit focus states and strict contrast requirements for your UI components.

Can I generate component specifications for a navigation sidebar using a token-based design framework?▼

Yes, you can generate component-level specifications for sidebars using a token-based design framework. It provides standardized typography scales and spacing rules to ensure navigation components align with an editorial style.

Does this design system framework require external dependencies to enforce responsive behavior?▼

No external dependencies are required. The framework enforces responsive behavior and strict quality gates for spacing and contrast natively, ensuring implementation-ready guidance for your digital products.

What is the best way to maintain editorial style across complex digital interfaces?▼

The best way to maintain editorial style is using a centralized design system framework. It provides standardized typography scales and semantic token definitions to enforce visual consistency across all UI components.

Related Skills

Explore More Design & Creative Skills→
hakushunhakushun

tailwind-design-system

Creates scalable design systems with Tailwind CSS v4 and semantic tokens.

Community
Advanced
jjyaoaojjyaoao
2.7k

frontend-design

Translate UI design goals into token-driven frontend design systems.

Community
Advanced
AshesOfTheUndeadAshesOfTheUndead

visual-design-foundations

Establish design systems with typography scales, 8-point grids, and semantic color tokens.

Community
Intermediate
superpollo02superpollo02

impeccable

Generate implementation-ready UI component specs enforcing WCAG 2.2 AA accessibility.

Community
Intermediate