frame

Create or update HTML frames on the OpenDesign canvas from project docs.

24|5|Updated Apr 20, 2026
One-click install
npx skills add https://github.com/basta/OpenDesign --skill frame-basta
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frame
Source: https://github.com/basta/OpenDesign/tree/main/.claude/skills/frame
Command: npx skills add https://github.com/basta/OpenDesign --skill frame-basta

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

OpenDesign users need a simple way to create or update an HTML frame on the canvas, ensuring frames are self-contained and live-synced with the project docs.

Core Features & Use Cases

  • Create or update a single frame HTML file per frame-id with inline CSS/JS, driven by the project's frames.json and layout data.
  • Integrate with PROJECT.md, DESIGN.md, and FEEL.md to shape the frame's appearance and behavior.
  • Use cases include adding a new screen, component, or page to a project, or updating an existing frame with new content, while keeping the canvas in sync.

Quick Start

Describe the desired frame and I will create or update the corresponding frame on the OpenDesign canvas.

Frequently Asked Questions about frame

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

FAQPage Schema
How do I create an HTML frame on an OpenDesign canvas?▼

To create an HTML frame on the OpenDesign canvas, describe the desired screen or component. The Skill generates a self-contained HTML file with inline CSS and JS, then syncs it to the canvas.

How does OpenDesign frame synchronization work with project docs?▼

Frame synchronization works by reading PROJECT.md, DESIGN.md, FEEL.md, and frames.json via the server API. The frame's appearance and behavior are shaped by integrating this project documentation data.

Do I need a running OpenDesign server to update frames?▼

Yes, you need a running OpenDesign server to update frames. The Skill requires server access to read project files like frames.json and to write the resulting HTML frame file to the filesystem.

Can I add inline CSS and JS when creating an OpenDesign frame?▼

Yes, you can add inline CSS and JS when creating an OpenDesign frame. The Skill generates a single HTML file per frame-id with embedded styles and scripts to ensure the frame is entirely self-contained.

What are the limitations of using HTML frames for OpenDesign components?▼

A key limitation is the dependency on a running OpenDesign server and filesystem access. Without the server API to read project docs and write files, the deterministic frame content and live canvas synchronization cannot function.