Subscribe Now
Trending News
Tools

Pencil.dev: Figma, která žije v gitu

Pencil.dev: Figma, která žije v gitu

Handoff je slovo, které vývojáři a designéři slyší nerádi. Označuje ten okamžik, kdy se ze souboru ve Figmě stane žádost o implementaci, z níž si každý přečte něco trochu jiného. Pencil.dev se rozhodl ho vyřešit docela radikálně: designové soubory prostě uklidí přímo do repozitáře.

Nástroj funguje buď jako rozšíření do VS Code a Cursor, nebo jako samostatná desktopová aplikace. Rozhraní vypadá jako Figma (vrstvy, CSS vlastnosti, přímá editace textů), takže kdo u Figmy strávil aspoň měsíc, zorientuje se rychle. Samotné soubory mají příponu .pen a leží v projektu vedle zdrojového kódu. Git je verzuje, větví, vrací zpátky. Jako normální kód.

Kde přichází MCP

Pencil při spuštění nastartuje lokální MCP server. To znamená, že Claude Code, Cursor nebo Windsurf můžou plátno číst a upravovat přes standardní Model Context Protocol. Workflow pak vypadá zhruba takhle: nakreslíš nebo vygeneruješ komponentu, Claude Code ji přečte a přepíše do Reactu, Next.js, Vue nebo čistého HTML/CSS. Celé automaticky, bez copy-paste. Konfigurace se nastaví sama při instalaci – žádné ruční editování JSON souborů, po spuštění /mcp příkazu v Claude Code je Pencil rovnou k dispozici, informuje ze svého testu DevelopersIO (březen 2026).

Smyčka funguje i obráceně. Existující komponenty z codebase se dají importovat zpátky do plátna, proměnné se mapují na CSS variables, takže sdílený design token systém není zbožné přání, ale faktická možnost.

Zajímavou drobností jsou „Notes” – lepkavé poznámky přímo na plátně. Na rozdíl od komentářů ve Figmě je lze jedním kliknutím proměnit ve spustitelný prompt. Plátno se tím mění spíš v agentní pracovní prostor než v statický soubor s chatem vedle.

Jeden háček, docela velký

Pencil sám o sobě nic generuje. Veškerá AI magie jede přes Claude Code, jehož nejlevnější plán stojí 20 dolarů měsíčně. Pencil je overlay, ne samostatný model – kdo Claude Code nemá, má hezké, ale v podstatě němé plátno, uvádí recenze z Banani.co (leden 2026).

Nástroj funguje zatím jen na Macu a Linuxu. Windows verze chybí. Prohlížečová taky – Pencil potřebuje lokální instanci Claude CLI.

Auto-save neexistuje, soubory .pen jsou šifrované a čitelné výhradně přes vlastní nástroje Pencilu. Diffovat je v gitu sice lze, ale co přesně v designu změnilo – to z gitového logu nevyčteš.

Nástroj je v early access a zatím zdarma. Jak dlouho to vydrží, nikdo neříká.

Pro koho to dává smysl

Nejlépe sedí vývojářům, kteří sami řeší i design a pracují přes Claude Code. Nebo malým týmům, kde jeden člověk zvládá obojí. Vibe-codeři, kteří chtějí vizuálně iterovat UI bez přepínání záložek, si přijdou na své.

Týmy se zaběhnutou Figmou a designéry, kteří kód nezajímá, lepší alternativu v Pencilu nenajdou. Stejně jako uživatelé Windows, ti prostě čekají dál.

Přiznám se, že myšlenka designových souborů verziovaných v gitu vedle kódu mi přišla zpočátku jako trochu zbytečná komplikace. Po přečtení reálných zkušeností si myslím opak – problém handoffu je dost reálný na to, aby tahle komplikace dávala smysl.

Pencil.dev je ke stažení na pencil.dev.


Zdroje: DevelopersIO (březen 2026), Banani.co (leden 2026), ToolWorthy (duben 2026), Inverness Design Studio (únor 2026)

Related posts