pencil-tokens

Community

Sync design tokens to Pencil.

Authorhjemmesidekongen
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill automates the process of translating design tokens defined in YAML into a format that the Pencil design tool can understand and use, ensuring design consistency.

Core Features & Use Cases

  • Token Translation: Converts design tokens (colors, typography, spacing, etc.) from tokens.yml and brand guidelines from guideline.yml into Pencil's set_variables format.
  • Reference Resolution: Ensures all YAML references within token definitions are resolved to concrete values before being sent to Pencil.
  • Use Case: After defining your brand's visual identity in tokens.yml, use this Skill to load all those styles into your active Pencil design file, making them immediately available for use.

Quick Start

Run the pencil tokens skill to load the design tokens into the active Pencil document.

Dependency Matrix

Required Modules

None required

Components

scriptsreferences

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: pencil-tokens
Download link: https://github.com/hjemmesidekongen/ai/archive/main.zip#pencil-tokens

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.