skills.rest
Trollz1004
Trollz1004COMMUNITY
Explore all skills by this author →
WebsiteGitHub

design-guide

Standardize frontend UI components, design tokens, and typography rules.

Updated Aug 23, 2026
Search Tags:#typography#frontend#components#tokens#ui-design#design-system#design-guide
One-click install
npx skills add https://github.com/Trollz1004/Sandbox-REPO-NEW-CODE-NOTHING-NEW-GOES-ON-ANTIGRAVITY --skill design-guide-trollz1004
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-guide
Source: https://github.com/Trollz1004/Sandbox-REPO-NEW-CODE-NOTHING-NEW-GOES-ON-ANTIGRAVITY/tree/main/dao-patches/.claude/skills/design-guide
Command: npx skills add https://github.com/Trollz1004/Sandbox-REPO-NEW-CODE-NOTHING-NEW-GOES-ON-ANTIGRAVITY --skill design-guide-trollz1004

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Paperclip's design guide provides a centralized, reusable UI design system to standardize components, tokens, typography, and patterns across all frontend work.

Core Features & Use Cases

  • Design tokens and typography guidelines to ensure visual consistency
  • Component conventions and patterns for reusable UI elements
  • A live design-guide showcase page to document approved designs and examples

Quick Start

Review the design guide before creating or updating UI components to ensure alignment with tokens, typography, and conventions.

Frequently Asked Questions about design-guide

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

FAQPage Schema
How do I create a consistent UI design system for frontend components?▼

To create a consistent UI design system, standardize your frontend components, design tokens, and typography rules. This eliminates visual inconsistencies across projects and ensures reusable UI elements align with documented conventions.

What are design tokens and how do they standardize UI typography?▼

Design tokens are centralized variables that standardize UI typography and visual properties. They ensure visual consistency across frontend components by providing reusable guidelines that designers and developers apply throughout the project.

How do I document component conventions and UI patterns for my team?▼

Document component conventions and UI patterns by creating a live design-guide showcase page. This page records approved designs, typography rules, and examples to support design governance and scalable UI delivery across your team.

Can I use this design system approach when updating existing UI components?▼

Yes, you can apply this design system approach when updating existing UI components. Reviewing the design guide before modifying components ensures alignment with established tokens, typography rules, and component conventions.

What's the best way to consolidate design patterns across multiple frontend projects?▼

The best way to consolidate design patterns across projects is implementing a centralized, reusable UI design system. It standardizes components, tokens, and typography, providing design governance for scalable UI delivery.

Why do my frontend UI components look inconsistent across different pages?▼

Frontend UI components look inconsistent across pages when lacking standardized design tokens, typography rules, and component conventions. A centralized design guide eliminates these inconsistencies by applying reusable patterns across all frontend work.

Related Skills

Explore More Design & Creative Skills→
aemdemosaemdemos

Get General Styling — Design System Extraction Skill

Extract site-wide styling and design tokens from a live website.

Official
Advanced
jasonmichaelbell78-creatorjasonmichaelbell78-creator

ui-design-system

Generate design tokens and document components for scalable UI systems.

Community
Advanced
VulcanNeuralDevVulcanNeuralDev

design-guide

Define and enforce Paperclip frontend design tokens, typography, and component patterns.

Official
Advanced
applewaveapplewave
1

phase-5-design-system

Create platform-agnostic design systems with tokens and base components.

Community
Advanced