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

friendly

Define design tokens, component anatomy, and accessibility requirements for UI development.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill solves the challenge of maintaining visual consistency and accessibility in UI design by providing a structured, token-based framework for creating approachable and intuitive interfaces.

Core Features & Use Cases

  • Design Token Management: Centralizes color, typography, and spacing tokens to ensure a unified visual language.
  • Accessibility Compliance: Enforces WCAG 2.2 AA standards and keyboard-first interaction patterns.
  • Use Case: When building a new dashboard, use this Skill to generate a component-level style guide that ensures all buttons, inputs, and modals adhere to the Friendly design system's rounded, pastel aesthetic.

Quick Start

Use the friendly skill to generate a comprehensive design guideline for a new navigation sidebar component.

Frequently Asked Questions about friendly

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

FAQPage Schema
How do I create a design system with consistent UI tokens?▼

Create a design system by using a structured, token-based framework that centralizes color, typography, and spacing tokens to ensure a unified visual language across all UI components.

What is the best way to enforce WCAG 2.2 AA accessibility in frontend design?▼

Enforce WCAG 2.2 AA accessibility by adopting a design framework that integrates compliance standards directly into component anatomy and enforces keyboard-first interaction patterns.

How do I generate component-level style guides for a new dashboard?▼

Generate component-level style guides by defining component anatomy and accessibility requirements within a standardized authoring workflow to ensure buttons, inputs, and modals adhere to your design system.

Can I use this design system framework for rounded, pastel aesthetic UIs?▼

Yes, you can use this framework for rounded, pastel aesthetics by applying its centralized design tokens to maintain visual consistency and approachability across your user interface.

Do I need specific dependencies to manage UI-UX design tokens?▼

No specific dependencies are required to manage UI-UX design tokens, as the framework operates independently to facilitate token definition and enforce spacing constraints through a standardized workflow.

Related Skills

Explore More Design & Creative Skills→
docaohieu2808docaohieu2808

design

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

Community
Advanced
eysenfalkeysenfalk

frontend-ui-ux

Transforms design briefs into accessible, reusable UI components with tokens and layouts.

Community
Advanced
PiercingXXPiercingXX
1

lingo

Generate implementation-ready design-system guidelines with WCAG 2.2 AA acceptance criteria.

Community
Intermediate
Mohamed-ElkahefMohamed-Elkahef

web-design-guidelines

Scan UI code files against Vercel Web Interface Guidelines and output file:line findings.

Community
Intermediate