Skills
.Work. You
Rest

tweaks

Community

Turn HTML into live, tweakable variants.

Design & Creative#localstorage#css-variables#panel#html-artifact#design-variants#tweaks#live-controls
Authorjunainfinity
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Wrapping an HTML artifact with a tweak panel enables you to interactively adjust design tokens (accent color, type scale, density, motion, and theme) and persist those changes locally so variants can be iterated without re-prompting.

Core Features & Use Cases

  • Live controls: a side panel that maps user inputs to CSS custom properties, letting designers experiment with visual variations on any HTML artifact.
  • Local persistence: saves your choices to localStorage so refreshes and multi-session work stay consistent.
  • Quick variant exploration: ideal for design explorations, A/B style comparisons, and presenting live options to stakeholders.

Quick Start

Wrap an HTML artifact with the tweaks panel and save your settings to localStorage.

Dependency Matrix

Required Modules

None required

Components

assets

💻 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: tweaks
Download link: https://github.com/junainfinity/osmDesign/archive/main.zip#tweaks

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.