linear-design-mirror

Extract structured design patterns from Linear-style UIs for Plot implementation.

Updated Mar 4, 2026
One-click install
npx skills add https://github.com/peterkwon248/linear-note-plot- --skill linear-design-mirror
Or copy as Structured Prompt for Agentโ–ผ
Please help me install this Agent Skill.
Skill: linear-design-mirror
Source: https://github.com/peterkwon248/linear-note-plot-/tree/main/.claude/skills/linear-design-mirror
Command: npx skills add https://github.com/peterkwon248/linear-note-plot- --skill linear-design-mirror

SYSTEM DOCUMENTATION & REQUIREMENTS

๐Ÿ’ก This Skill includes references (resource) components.

What problem does it solve?

๋ถ„์„๊ฐ€์™€ ๋””์ž์ด๋„ˆ๊ฐ€ Linear ์Šคํƒ€์ผ์˜ UI/UX ํŒจํ„ด์„ ์ฒด๊ณ„์ ์œผ๋กœ ๋ถ„์„ํ•˜๊ณ  Plot์— ์žฌํ™œ์šฉ ๊ฐ€๋Šฅํ•œ ๊ตฌํ˜„ ๊ฐ€์ด๋“œ๋ฅผ ์ œ๊ณตํ•˜๋Š” ๋ฌธ์ œ๋ฅผ ํ•ด๊ฒฐํ•ฉ๋‹ˆ๋‹ค.

Core Features & Use Cases

  • Analyze: ์Šคํฌ๋ฆฐ์ƒท, DevTools ์บก์ฒ˜, URL๋กœ๋ถ€ํ„ฐ ํŒจํ„ด์„ ์ถ”์ถœํ•˜๊ณ  ๊ตฌ์กฐํ™”๋œ ๋””์ž์ธ ํŒจํ„ด์œผ๋กœ ์ •๋ฆฌํ•ฉ๋‹ˆ๋‹ค.
  • Apply: ์ถ•์ ๋œ ํŒจํ„ด ์ง€์‹์„ ๋ฐ”ํƒ•์œผ๋กœ Plot์— ์ ์šฉํ•  ๊ตฌํ˜„ ๊ฐ€์ด๋“œ๋ฅผ ์ƒ์„ฑํ•ฉ๋‹ˆ๋‹ค.
  • ์—ฐ๊ณ„: design-quality-gate์™€์˜ ์—ฐ๋™์œผ๋กœ ํ’ˆ์งˆ ์ปจํŠธ๋กค ํฌ์ธํŠธ๋ฅผ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.

Quick Start

Analyze the provided UI artifact (screenshot, DevTools capture, or URL) and generate a Plot-ready implementation guide.

Frequently Asked Questions about linear-design-mirror

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

FAQPage Schema
How do I extract UI patterns from a Linear screenshot for reuse?โ–ผ

Linear UI patterns are extracted from screenshots, DevTools captures, or URLs by identifying and structuring design elements across sidebars, lists, command palettes, and triage surfaces into actionable implementation guidance.

What design patterns can I identify from Linear's command palette and inbox?โ–ผ

Identifiable Linear design patterns span sidebars, lists, command palettes, inbox, and triage surfaces. The tool maps these extracted UI/UX patterns to Plot's design tokens and surfaces to generate actionable implementation guidance.

Can I apply Linear design patterns to Plot's design tokens?โ–ผ

Yes, extracted Linear design patterns are mapped directly to Plot's design tokens and surfaces, generating an actionable implementation guide that translates Linear-style UI components into Plot-ready structures for reuse.

Does this work with design-quality-gate to validate UI implementations?โ–ผ

Yes, it integrates with design-quality-gate to validate implementations. This integration provides quality control points to ensure that extracted Linear UI/UX patterns applied to Plot meet established quality standards during implementation.

How do I generate an implementation guide from a DevTools capture?โ–ผ

To generate an implementation guide from a DevTools capture, provide the capture as input. The tool analyzes the artifact to extract Linear-style UI patterns and maps them to Plot's design tokens and surfaces, producing a Plot-ready implementation guide.