skills.rest
julilaoshi
julilaoshiCOMMUNITY
Explore all skills by this author →
GitHub

julilaoshi-design

Edit .pen files with Pencil MCP or tweak HTML in a browser editor.

117|11|Updated Apr 18, 2026
Search Tags:#design workflow#HTML design#Pencil MCP#Web 2.0 editor#Pencil tool
One-click install
npx skills add https://github.com/julilaoshi/julilaoshi-design --skill julilaoshi-design
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: julilaoshi-design
Source: https://github.com/julilaoshi/julilaoshi-design/tree/main/skill
Command: npx skills add https://github.com/julilaoshi/julilaoshi-design --skill julilaoshi-design

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires pencil, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill provides a public-safe design workflow for Pencil users, including a Web 2.0 editor for lightweight HTML design tweaking.

Core Features & Use Cases

  • Pencil MCP Mode: Edit .pen files with Pencil MCP.
  • Web Editor Mode: Use a free browser editor for HTML tweaking.
  • Public-Safe Execution: No redistribution of Pencil required.
  • Integration: Strongly paired with takeaway-skill and reference data.

Quick Start

To begin using julilaoshi-design, please load the skill and select the desired mode (Pencil MCP or Web Editor).

Frequently Asked Questions about julilaoshi-design

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

FAQPage Schema
How do I edit Pencil .pen files using MCP?▼

Edit Pencil .pen files by loading the skill and selecting Pencil MCP mode to interface directly with the Pencil tool. This workflow requires having the Pencil dependency installed and access to MCP tools for executing modifications.

What is a Web 2.0 HTML editor for lightweight design tweaks?▼

A Web 2.0 HTML editor for lightweight design tweaks is a free browser-based interface provided within this skill to modify HTML code directly. It allows users to tweak HTML in the browser without redistributing the core Pencil application.

Do I need to install Pencil to use the Web 2.0 editor?▼

You do not need to install Pencil to use the Web 2.0 editor for HTML tweaking, as it operates independently within the browser. Pencil is only required if you intend to use the Pencil MCP mode for editing .pen files.

How do I start a Pencil design workflow with a Web 2.0 editor?▼

Start the Pencil design workflow by loading the skill and selecting your desired mode: Pencil MCP for .pen file editing or the Web Editor for HTML tweaking. This provides a public-safe execution environment without requiring Pencil redistribution.

Can I use this design workflow safely without redistributing Pencil?▼

You can use this design workflow safely because it provides public-safe execution that does not require the redistribution of the Pencil software. It pairs reference data with a browser-based Web 2.0 editor to ensure compliant HTML tweaking.

Related Skills

Explore More Design & Creative Skills→
SpaceZephyrSpaceZephyr
14

image2pencil

Recreate UI screenshots as editable Pencil .pen files with design documentation.

Community
Intermediate
zts212653zts212653
2.6k

pencil-design

Convert .pen design files into React/Tailwind components.

Community
Intermediate
iilleagliilleagl

pen-design-generator

Generate Pencil .pen design drafts from UI requirements using DevUI components.

Community
Advanced
Pixel-Process-UGPixel-Process-UG
1

artifacts-builder

Generate self-contained HTML/CSS/JS artifacts for interactive demos and prototypes.

Official
Intermediate