paper

Define tokenized typography, color, and spacing foundations for print-inspired interfaces.

2.3k|211|Updated Mar 9, 2026
One-click install
npx skills add https://github.com/bergside/awesome-design-skills --skill paper-bergside
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: paper
Source: https://github.com/bergside/awesome-design-skills/tree/main/skills/paper
Command: npx skills add https://github.com/bergside/awesome-design-skills --skill paper-bergside

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams implement a consistent, print-inspired “paper” design system so UI looks intentional and readable across components.

Core Features & Use Cases

  • Tokenized foundations: Applies the Paper palette, typography scale, and spacing rhythm using explicit tokens.
  • Implementation-ready component guidance: Defines how to structure components, states, and interaction behavior while preserving visual hierarchy.
  • Accessible by default: Requires WCAG 2.2 AA thinking with keyboard-first interaction and visible focus states to reduce usability regressions.

Quick Start

Ask your agent to generate UI component guidelines and implementation rules that strictly follow the Paper tokens (Roboto/Montserrat/PT Mono, spacing 4/8/12/16/24/32, and the Paper color set) and include testable accessibility acceptance criteria.

Frequently Asked Questions about paper

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

FAQPage Schema
How do I build a print-inspired UI design system with consistent typography and spacing?

To build a print-inspired UI design system, you establish reusable typography, color, and spacing foundations using explicit tokens. This standardizes component families and interaction patterns to ensure consistent visual hierarchy across clean, tactile interfaces.

How do I generate accessibility acceptance criteria for design system components?

Generating accessibility acceptance criteria requires enforcing WCAG 2.2 AA standards with keyboard-first interaction and visible focus states. This approach ensures usability regressions are reduced by structuring component guidelines with testable accessibility rules.

What are token-first rules for design system spacing and typography scales?

Token-first rules for design system spacing and typography scales eliminate ambiguous values by enforcing explicit tokens. This requires defining specific spacing rhythms like 4/8/12/16/24/32 and typography sets such as Roboto, Montserrat, and PT Mono.

Can I use paper aesthetic design tokens for minimal and clean visual styling?

Yes, you can use paper aesthetic design tokens for minimal and clean visual styling. The system applies a tactile, print-inspired palette and spacing rhythm to generate implementation-ready component guidance that preserves visual hierarchy.

Does this design system Skill require specific font families for its components?

Yes, the design system requires specific font families for its components. The Paper tokens explicitly define typography using Roboto, Montserrat, and PT Mono to maintain readable, intentional visual styling across the interface.

What is the best way to structure component guidelines for a tactile UI system?

The best way to structure component guidelines for a tactile UI system is to output structured foundations, component rules, accessibility acceptance criteria, and QA checklists. This ensures consistent interaction behavior and standardizes implementation across workflows.