A professional pixel art editor built with React and TailwindCSS featuring multiple layout modes and a comprehensive toolset.

• Selection Tool: Select and manipulate areas of your artwork
• Move Tool: Move selected areas around the canvas
• Brush: Paint with customizable brush size and opacity
• Pencil: Draw precise single pixels with pixel-perfect accuracy
• Eraser: Remove pixels with adjustable size
• Fill Bucket: Flood fill connected areas with color
• Eyedropper: Sample colors directly from the canvas
• Line Tool: Draw perfect straight lines
• Rectangle Tool: Draw rectangles (hold Shift for filled)
• Circle Tool: Draw circles (hold Shift for filled)

• Draggable Panels: Move any panel around the workspace by dragging its title bar
• Resizable Panels: Resize panels from the bottom-right corner to fit your needs
• Toggleable Panels: Show/hide any panel with the panel manager
• Minimizable Panels: Minimize panels to save space while keeping them accessible
• Persistent Layout: Panel positions and states are maintained during your session

• Flexible Sizing: Choose from presets (8×8 to 128×128) or custom dimensions (4×4 to 512×512)
• Independent Dimensions: Set width and height separately for non-square canvases
• Smart Grid: Automatically hides when pixels are too small to see clearly
• Zoom-Adaptive: Canvas scales intelligently based on size

• Primary/Secondary Colors: Left-click for primary, right-click for secondary
• Color Picker: HTML5 color picker with hex input
• 32 Preset Colors: Carefully curated color palette
• Eyedropper Sampling: Pick colors directly from your artwork
• Transparent Support: Full transparency support for layered artwork

• Tools Panel: Complete drawing toolkit with canvas size controls
• Colors Panel: Primary/secondary colors with 32 preset colors and color picker
• Layers Panel: Visual layer management with opacity and visibility controls
• Properties Panel: Context-sensitive tool properties and settings
• Export Panel: Professional export options with scaling and format choices
• Panel Manager: Central control for showing/hiding and resetting panel layout

• PNG Export: High-quality raster images (1-20px per pixel)
• SVG Export: Scalable vector graphics
• Grid Export: Optional grid lines in exported images
• Custom Scaling: Adjust output resolution for any use case

• Deep Dark Theme: Professional dark interface (#0d1117 background)
• System Integration: Automatic switching based on OS preference
• Smooth Transitions: Animated theme changes
• Enhanced Contrast: Optimized for extended creative sessions

The new flexible panel system allows you to completely customize your workspace:

• Drag and Drop: Click and drag any panel by its title bar to move it anywhere on screen
• Resize: Drag the bottom-right corner of any panel to resize it to your preferred size
• Minimize/Maximize: Use the minimize button (-) in the title bar to collapse panels
• Show/Hide: Toggle panel visibility using the Panel Manager in the top-right
• Reset Layout: Restore all panels to their default positions with one click

• Tools Panel: All drawing tools, canvas size controls, and quick actions
• Colors Panel: Color picker, palette, and primary/secondary color selection
• Layers Panel: Layer management with visibility, opacity, and organization
• Properties Panel: Tool-specific settings and canvas information
• Export Panel: Export options with format and scaling controls

• Arrange panels around your canvas for optimal workflow
• Minimize panels you don't need to reduce clutter
• Resize panels to show more or less content as needed
• Use the Panel Manager to quickly show/hide specific panels

1. Select Brush or Pencil tool
2. Choose your color from the palette
3. Adjust brush size and opacity in Properties panel
4. Click and drag on canvas to draw

• Line: Click and drag to draw straight lines
• Rectangle: Click and drag to draw rectangles (Shift for filled)
• Circle: Click and drag from center outward (Shift for filled)

• Select: Click and drag to select rectangular areas
• Move: Drag selected areas to new positions
• Eyedropper: Click any pixel to sample its color

• Fill Bucket: Click to fill connected areas with the same color
• Undo/Redo: Full history support for all operations
• Grid Toggle: Show/hide pixel grid for precision work
• Custom Canvas: Set any dimensions up to 512×512 pixels

1. Customize Workspace: Arrange panels to match your preferred workflow
2. Set Canvas Size: Use presets or custom dimensions in the Tools panel
3. Select Tools: Choose from the comprehensive tool set
4. Manage Colors: Use the Colors panel for primary/secondary color system
5. Adjust Properties: Fine-tune tool settings in the Properties panel
6. Organize Layers: Use the Layers panel for complex artwork
7. Export: Save your work using the Export panel with custom scaling

• React 18.2.0 with TypeScript for type safety
• Professional UI Components with proper SVG icons
• TailwindCSS with custom dark theme
• HTML5 Canvas for high-performance drawing
• Advanced Algorithms: Bresenham's line drawing, flood fill
• Responsive Design: Works on all screen sizes
• Memory Efficient: Optimized pixel storage and history

• Modern browsers with HTML5 Canvas support
• Automatic fallbacks for older browsers
• Touch support for mobile devices
• Keyboard shortcuts for power users

• Game Development: Sprites, tiles, and game assets
• Icon Design: Clean, pixel-perfect icons
• Digital Art: Retro-style artwork and animations
• Prototyping: Quick mockups and concepts
• Education: Learning pixel art fundamentals

The application now provides a truly professional pixel art editing experience with a flexible panel system, comprehensive tools, and a fully customizable workspace that adapts to your creative needs.