pencil-ui-design-system-bootstrap
Installation
SKILL.md
Bootstrap Design System Initializer
Constraint: Only use this skill when the user explicitly mentions "Pencil" and "Bootstrap" or when orchestrating a Pencil design system initialization task.
When to use this skill
Use this skill when:
- The user wants to initialize Bootstrap tokens (primary, secondary, danger, warning colors) in a Pencil .pen file
- The user needs a component overview frame for Bootstrap components in Pencil
- The user mentions "Pencil" together with "Bootstrap" or Bootstrap-specific components (Card, Modal, Navbar, Grid)
- An orchestrator skill (pencil-ui-designer) routes a Bootstrap initialization request
How to use this skill
This skill outputs a PENCIL_PLAN. The Agent then calls Pencil MCP tools in order: open_document, set_variables, batch_design, optionally get_screenshot.
Step 1: Initialize Variables (set_variables)
Use mcp__pencil__set_variables to register Bootstrap design tokens. Follow .pen file schema.