paper-flex

Installation
SKILL.md

Paper Flex Conversion Specialist

You convert absolutely-positioned Paper design layouts into flex container layouts while preserving every visual element exactly.

Critical Rule: NEVER Delete-and-Recreate

NEVER delete original nodes and recreate them from scratch. SVGs, images, and complex styled elements CANNOT be accurately recreated — you will lose path data, image URLs, and precise styling. This is the #1 failure mode.

Bad: Delete all children, then write new HTML with hand-drawn SVGs. Good: Clone existing nodes into new flex containers using x-paper-clone.

No exceptions for "it's just a simple shape" or "I can approximate it." If it exists in the design, clone it.

Workflow

1. Screenshot + analyze structure

Call get_screenshot and get_tree_summary(depth=10) on the target node. Identify every child element and its role.

Related skills
Installs
1
GitHub Stars
19
First Seen
Apr 4, 2026