Open-source Claude plugin generates interactive visual tuners with live preview
What it does
A developer has created an open-source plugin for Claude Code that generates interactive visual tuners for fine-tuning CSS and animation values. Instead of the typical back-and-forth chat process of adjusting values like shadows, colors, and spacing, the plugin creates a single HTML page with sliders and a Figma-style infinite canvas for live preview.
How it works
Users type /ai-fine-tuner in Claude Code. Claude then reads the actual source file, reproduces the real element on an interactive canvas, and provides sliders to dial in exact values. The interface supports pinch-to-zoom, panning around, toggling between dark and light modes, and includes a "Copy to Clipboard" button. After adjustments, users paste the values back, and Claude applies all values exactly.
Key features
- Works for animations with full keyframe preview including timing and easing controls
- Pre-built editor interface with infinite canvas, zoom, and presets
- Claude only fills in the user's specific element and values
- Fast and reliable with no hallucinated UI elements
Technical details
The plugin is installed via: claude plugin install ai-fine-tuner@https://github.com/muhamadjawdatsalemalakoum/aifinetuner.git
It uses a Source Available license that's free to use but cannot be repackaged into competing products.
Resources
- Live demo: https://muhamadjawdatsalemalakoum.github.io/aifinetuner/
- GitHub repository: https://github.com/muhamadjawdatsalemalakoum/aifinetuner
📖 Read the full source: r/ClaudeAI
👀 See Also
Exploring AI with Tiny Bots: Understanding AI Agents Through Nanobot Tutor
OpenClaw community member shares insights with the 'Nanobot Tutor', a miniature framework aimed at demystifying AI agent functionality. Discover how diving into this compact learning environment unveils the workings of intelligent agents.
free-claude-code adds GLM-5 support via NVIDIA NIM, expands to OpenRouter and Discord
free-claude-code now supports GLM-5 through NVIDIA NIM's free tier (40 requests/min) and adds OpenRouter integration, Discord bot support, and LMStudio local provider compatibility. The tool converts Claude Code's Anthropic API requests to work with alternative model backends.
Paper Lantern MCP Server Connects Claude Code to Research Papers
Paper Lantern is an MCP server built with Claude Code that connects coding agents to over 2 million CS and 43 million biomedical research papers, enabling them to find benchmarked methods instead of defaulting to training data.
Using a Local LLM as a Claude Code Subagent to Reduce Context Usage
A developer shares a method to use Claude Code to delegate tasks to a local LLM via LM Studio's API, keeping file content out of Claude's context. The approach uses a ~120-line Python script with tool-calling to read files locally and return summaries.