vanilla canvas

Community

Create interactive web UIs with pure HTML, CSS, and JavaScript.

Authorparkerhancock
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill enables building dynamic and interactive user interfaces directly in the browser using only native web technologies, eliminating dependencies on frameworks or build tools.

Core Features & Use Cases

  • Pure HTML/CSS/JS Development: Write semantic HTML and vanilla JavaScript to design accessible UIs.
  • Two-way State Synchronization: Maintain real-time synchronization between the browser and external state via JSON files.
  • Native Patterns & Components: Implement dialogs, accordions, tabs, date pickers, dropdowns, and data tables using only standard HTML tags and minimal JavaScript.
  • Use Case: Develop a fully functional dashboard or form-based application without any build step or third-party frameworks.

Quick Start

Write an index.html file with your UI structure inside the specified directory to immediately render and interact with your interface in the browser.

Dependency Matrix

Required Modules

None required

Components

references

💻 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: vanilla canvas
Download link: https://github.com/parkerhancock/browser-canvas/archive/main.zip#vanilla-canvas

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.