Skills
.Work. You
Rest

mockup-sandbox

Community

Design and prototype web UI on the canvas.

Design & Creative#prototyping#frontend development#canvas#ui design#web components#iframe
Authornirajrathod19
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill allows you to create, preview, and iterate on any web UI content directly on the canvas, providing a live-rendered environment for your designs.

Core Features & Use Cases

  • Live UI Rendering: Display interactive web components on the canvas via an embedded iframe.
  • Prototyping & Iteration: Design new components, preview responsive designs (mobile/tablet/desktop), and compare design variants side-by-side.
  • Component States: Preview loading, error, or empty states for your components.
  • Theme Comparison: Easily compare dark vs. light mode designs.
  • Use Case: You need to design a new pricing card component for a website. Activate this Skill to create the card, preview it on different screen sizes, and iterate on its design until it's perfect, all within your canvas.

Quick Start

Use the mockup-sandbox skill to create a pricing card component on the canvas.

Dependency Matrix

Required Modules

None required

Components

scriptsreferencesassets

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: mockup-sandbox
Download link: https://github.com/nirajrathod19/Inlytix_BI/archive/main.zip#mockup-sandbox

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.