Ploto - Interactive Whiteboard to ideate/discuss/ship

A modern, interactive whiteboard application built with React, TypeScript, and Konva.js.

Features

• 🖌️ Drawing Tools

  • Freehand drawing (pen tool)
  • Basic shapes (rectangle, circle, line)
  • Stroke width & color selection

• 🎯 Selection & Editing

  • Move, resize, rotate objects
  • Delete selected objects

• 🏗️ Toolbar UI

  • Tool selection (pen, shape, eraser)
  • Color picker & stroke width controls

Tech Stack

• React + TypeScript
• Zustand (State Management)
• TailwindCSS (Styling)
• Konva.js (Canvas Rendering)

Getting Started

1. Clone the repository:

git clone https://github.com/yourusername/ploto.git
cd ploto

2. Install dependencies:

npm install

3. Start the development server:

npm run dev

4. Open your browser and navigate to http://localhost:5173

Usage

1. Select a drawing tool from the toolbar on the left
2. Choose your desired color and stroke width
3. Click and drag on the canvas to draw or create shapes
4. Use the select tool to move, resize, or delete objects

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

License

This project is licensed under the Apache License - see the LICENSE file for details.