Sebastian Krüger 7f4d574c64 feat(tools): implement advanced brush tools - Clone Stamp, Smudge, and Dodge/Burn
Added three professional-grade image manipulation tools to complete Feature 4:

Clone Stamp Tool (Shortcut: 8)
- Sample from source location with Alt+Click
- Paint sampled content to destination
- Maintains relative offset for natural cloning
- Supports soft/hard brush with hardness setting

Smudge Tool (Shortcut: 9)
- Creates realistic paint-smearing effects
- Progressively blends colors for natural smudging
- Uses flow setting to control smudge strength
- Soft brush falloff for smooth blending

Dodge/Burn Tool (Shortcut: 0)
- Dodge mode: Lightens image areas (default)
- Burn mode: Darkens image areas (Alt key)
- Professional photography exposure adjustment
- Respects hardness setting for precise control

All tools:
- Fully integrated with tool palette and keyboard shortcuts
- Support smooth interpolation for fluid strokes
- Use existing tool settings (size, opacity, hardness, flow, spacing)
- Lazy-loaded via code splitting system
- Icons from Lucide React (Stamp, Droplet, Sun)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-21 16:27:02 +01:00

Paint UI

A modern, browser-based image editor built with Next.js 16 and Tailwind CSS 4. Inspired by miniPaint, reimagined for the modern web.

Features (Planned)

  • 🎨 Multi-layer Canvas - Professional layer system with blend modes
  • 🖌️ Drawing Tools - Pencil, brush, eraser, fill, and selection tools
  • Image Effects - 50+ filters and effects (blur, sharpen, color adjustments)
  • 📝 Text Tool - Add text with web fonts
  • 🔄 Undo/Redo - Full history system
  • 💾 File Support - Open/save PNG, JPG, WEBP, GIF, and project files
  • 🎭 Dark Mode - Beautiful dark and light themes
  • ⌨️ Keyboard Shortcuts - Power user friendly
  • 📱 Responsive - Works on desktop, tablet, and mobile

Tech Stack

  • Framework: Next.js 16 (App Router)
  • UI: React 19 + TypeScript
  • Styling: Tailwind CSS 4
  • Components: Radix UI / Shadcn
  • State: Zustand
  • Canvas: HTML5 Canvas API + Web Workers

Getting Started

Prerequisites

  • Node.js 20+
  • pnpm 9+

Installation

# Clone repository
git clone ssh://git@dev.pivoine.art:2222/valknar/paint-ui.git
cd paint-ui

# Install dependencies
pnpm install

# Run development server
pnpm dev

Open http://localhost:3000 in your browser.

Documentation

Inspiration

This project is inspired by miniPaint, an excellent open-source image editor. While paint-ui is a complete rewrite with modern technologies, we aim to preserve the powerful capabilities that make miniPaint great.

License

MIT

Author

valknar

Repository

https://dev.pivoine.art/valknar/paint-ui

Description
No description provided
Readme 687 KiB
Languages
TypeScript 98.2%
CSS 1.6%
Dockerfile 0.2%