LHRUN/paint-board

An open-source web-based creative canvas

English / 中文(简体) / 中文(繁体) / 日本語 / 한국어

Preview

Link: https://songlh.top/paint-board/

Features

• Drawing Mode
  • Free Drawing: Provides 12 different brush styles, including basic brush, rainbow brush, multi-shape brush, multi-material brush, pixel brush, multi-color brush, text brush, multi-line connection brush, mesh brush, multi-point connection brush, wave curve brush, and thorn brush to meet diverse drawing needs.
  • Shape Drawing: Supports drawing rich graphics, including built-in shapes and Lucide icon library graphics, which can be used with just a click. Configurable line width, line style, fill color, and fill style.
• Eraser Mode: Can linearly erase all content and supports linear width configuration.
• Selection Mode: Supports clicking or box selection for editing. After selection, you can perform drag, scale, rotate operations and various custom configurations through handles.
• Canvas Mode: Supports canvas background, custom size, and global drawing configuration.
• Action Bar: Functions from left to right are undo, redo, copy current selection, delete current selection, draw text, upload image, clear drawing content, save as image, and open file list.
• Multi-file Configuration: Supports switching between multiple canvases, each canvas can have custom titles, add, delete, and provides sorting and upload/download functions.
• i18n: 中文(简体), 中文(繁体), English, 日本語, 한국어.

V1.3.0 Video Demo

Quick Start

git clone https://github.com/LHRUN/paint-board.git
pnpm install
pnpm dev

Docker Support

1. Build a Docker image with the name paint-board.

docker build -t paint-board .

1. Start a docker container.

docker run -d -p 8080:80 --name paint-board paint-board

1. Accessed by opening http://localhost:8080/paint-board/ in your browser.

Browser support

We recommend using the latest version of Google Chrome, the following is the minimum version support

Edge	Firefox	Chrome	Safari
80+	80+	70+	13+

Contact me

If you have any suggestions or good ideas, welcome to contact me at any time!

• Email: song.lhlh@gmail.com
• Telegram: https://t.me/longhao_song
• Twiter: https://twitter.com/Song_LongHao
• WeChat:

Contributing

I'm glad you're interested in contributing to PAINT BOARD. If you find a bug and want to fix it, please submit it in an Issue first. For new feature additions, please contact us in Discussions, or directly through the contact details provided above, and read the Contribution Guidelines below before contributing. Thank you for your support!

Contribution Guidelines

Document

• After refactoring with Fabric.js
  • Exploring the Canvas Series: combined with Transformers.js to achieve intelligent image processing
  • Exploring the Canvas Series: The Art of Time Reversal in the Canvas
  • Exploring the Canvas Series: Creative Brushes Part 1
  • Exploring the Canvas Series: Creative Brushes Part 2
  • Exploring the Canvas Series: Creative Brushes Part 3
  • writing...
• Before refactoring with Fabric.js
  • Canvas Artistry：Mastering Selection, Dragging, and Scaling
  • Canvas Artistry：Drawing magic with multiple effects

License

MIT License. See the LICENSE file.