skills.rest
mxzinke
mxzinkeCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

design

Apply intent-driven design systems to create consistent typography, color, spacing, and layout across websites, dashboards, documents, and posters.

2|2|Updated Feb 22, 2026
Search Tags:#typography#design#branding#accessibility#visual-design#design-systems
One-click install
npx skills add https://github.com/mxzinke/atlas --skill design-mxzinke
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design
Source: https://github.com/mxzinke/atlas/tree/main/app/defaults/skills/design
Command: npx skills add https://github.com/mxzinke/atlas --skill design-mxzinke

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Visual design guidance and systematization to produce intentional, craft-driven visuals across web, applications, documents, posters, and infographics, reducing guesswork and inconsistency.

Core Features & Use Cases

  • Domain exploration to identify design vocabulary and constraints across product contexts.
  • Token-driven guidance for typography, color, spacing, borders, and components to ensure coherent experiences.
  • Use Case: when asked to design a UI or document, generate a consistent design direction with accessible and responsive constraints.

Quick Start

Analyze a design brief and produce a cohesive direction that can be implemented in a design system.

Frequently Asked Questions about design

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

FAQPage Schema
How do I create a consistent visual design system for web and print artifacts?▼

A design brief provides the foundational context and constraints needed to generate a cohesive visual direction. Supplying product scope details allows the intent-driven system to produce accessible, responsive, and token-driven design guidance.

What is token-driven design guidance and how does it work for UI layouts?▼

Token-driven design guidance enforces craft-level guardrails by mapping typography, color, spacing, and border decisions to predefined variables. This approach ensures accessibility and responsive behavior across production-ready visual artifacts.

Can I use this approach to design accessible dashboards and posters?▼

Yes, this approach supports designing accessible dashboards and posters by enforcing accessibility constraints and responsive behavior. It applies domain exploration to identify design vocabulary and constraints across product contexts.

What's the best way to ensure typography and color accessibility in visual design?▼

To ensure typography and color accessibility, apply intent-driven design systems that enforce accessibility constraints and responsive behavior. Token-driven decisions for color and spacing maintain compliance across visual artifacts.

How do I reduce visual inconsistency when designing across different domains?▼

To reduce visual inconsistency across domains, apply a unified design system with token-driven guidance. This enforces craft-level guardrails and coherent experiences across websites, dashboards, documents, and posters.

Related Skills

Explore More Design & Creative Skills→
djkloopdjkloop

shape

Conduct a structured discovery interview and produce a design brief.

Community
Intermediate
h4vzzh4vzz
33

Frontend Design

Generate accessible React, Vue, Svelte, or HTML components with design tokens.

Community
Advanced
compozycompozy
2.5k

minimalist-ui

Define and enforce a minimalist UI protocol for typography, color, and layout.

Official
Advanced
BaronkiBaronki
1

visual-design-foundations

Establish design tokens for typography, color, spacing, and iconography.

Community
Advanced