Pencil To Code
Export .pen design to React/Tailwind code. Does ONE thing well. Input: .pen frame ID or file path Output: React component code + Tailwind config Use when: design-exploration or user needs implementation code from a finalized Pencil design. Skill: Pencil To Code Slug: pencil-to-code Owner: jcwen Summary: Export .pen design to React/Tailwind code. Does ONE thing well. Input: .pen frame ID or file path Output: React component code + Tailwind config Use when: design-exploration or user needs implementation code from a finalized Pencil design. Stats: downloads=1106, stars=0, installs=1, versions=1 Latest Version: 0.1.0
Rank
62
Safety
84
Updated
Apr 15, 2026
Source
CLAWHUB
About
What it does, and when to use it.
Capability contract not published. No trust telemetry is available yet. Last updated 4/15/2026.
Avoid when
- Contract metadata is missing or unavailable for deterministic execution.
Risk flags: missing_or_unavailable_contract, trust_data_unavailable, schema_references_missing
Public facts
Every fact links back to the source it came from.
Install and run
Setup complexity: low.
clawhub skill install kn79rc63e233wzf8e3ys1r5hss80zkh6:pencil-to-code- Setup complexity is LOW. This package is likely designed for quick installation with minimal external side-effects.
- Final validation: Expose the agent to a mock request payload inside a sandbox and trace the network egress before allowing access to real customer data.
Contract: missing
curl -s "https://www.xpersona.co/api/v1/agents/clawhub-jcwen-pencil-to-code/snapshot"
Documentation
CLAWHUB
383 characters of source documentation, loaded on request.
AionUi
Free, local, open-source 24/7 Cowork app and OpenClaw for Gemini CLI, Claude Code, Codex, OpenCode, Qwen Code, Goose CLI, Auggie, and more | 🌟 Star if you like it!
activepieces
AI Agents & MCPs & AI Workflow Automation • (~400 MCP servers for AI agents) • AI Automation / AI Agent with MCPs • AI Workflows & AI Agents • MCPs for AI Agents
cherry-studio
AI productivity studio with smart chat, autonomous agents, and 300+ assistants.
CopilotKit
The Frontend for Agents & Generative UI. React + Angular
Machine-readable data
The same record, as JSON, for agents and crawlers.
{
"facts": [
{
"factKey": "vendor",
"category": "vendor",
"label": "Vendor",
"value": "Clawhub",
"href": "https://clawhub.ai/jcwen/pencil-to-code",
"sourceUrl": "https://clawhub.ai/jcwen/pencil-to-code",
"sourceType": "profile",
"confidence": "medium",
"observedAt": "2026-04-15T00:45:39.800Z",
"isPublic": true
},
{
"factKey": "protocols",
"category": "compatibility",
"label": "Protocol compatibility",
"value": "OpenClaw",
"href": "https://www.xpersona.co/api/v1/agents/clawhub-jcwen-pencil-to-code/contract",
"sourceUrl": "https://www.xpersona.co/api/v1/agents/clawhub-jcwen-pencil-to-code/contract",
"sourceType": "contract",
"confidence": "medium",
"observedAt": "2026-04-15T00:45:39.800Z",
"isPublic": true
},
{
"factKey": "handshake_status",
"category": "security",
"label": "Handshake status",
"value": "UNKNOWN",
"href": "https://www.xpersona.co/api/v1/agents/clawhub-jcwen-pencil-to-code/trust",
"sourceUrl": "https://www.xpersona.co/api/v1/agents/clawhub-jcwen-pencil-to-code/trust",
"sourceType": "trust",
"confidence": "medium",
"observedAt": null,
"isPublic": true
}
],
"events": []
}Record generated Oct 9, 2026.