InkWell is a comprehensive note-taking and digital canvas application built for a seamless study and creative experience. It combines a rich text editor for structured notes with an infinite canvas for freehand drawing, diagramming, and PDF annotation.
- Flexible Workspaces: Switch instantly between a dedicated notes view, an infinite digital canvas, or a split-screen view to use both simultaneously.
- PDF Integration: Import multi-page PDF documents directly into the canvas. Each page becomes a backdrop that you can draw over, annotate, and export back to a high-quality PDF.
- Infinite Canvas: Pan, zoom, and explore a limitless workspace. Draw with various pen styles (normal, fountain, marker, highlighter, and pencil) that support pressure simulation.
- Rich Text Editor: Take structured notes alongside your canvas with formatting options and real-time synchronization.
- Shape and Tool Library: Add sticky notes, text blocks, geometric shapes, and arrows. A built-in laser pointer tool is available for presentations.
- Dark and Light Mode: Built-in support for multiple themes to reduce eye strain and match your system preferences.
- Local Storage: Work offline with fast, secure local storage ensuring your notebooks are always accessible.
InkWell is a modern web application built on the following technologies:
- Frontend: React and Vite for a fast, responsive user interface.
- Styling: Tailwind CSS for clean, utility-first styling and theming.
- State Management: Zustand for lightweight, fast global state management.
- Canvas Rendering: Custom SVG-based rendering engine optimized for smooth panning and zooming.
- Pen Dynamics: Perfect-freehand for high-fidelity, pressure-sensitive stroke rendering.
- PDF Processing: PDF.js and PDF-lib for robust client-side document import and export.
Ensure you have Node.js (version 18 or higher) and npm installed on your machine.
-
Clone the repository to your local machine.
-
Navigate to the frontend directory: cd frontend
-
Install the dependencies: npm install
To start the development server: npm run dev
The application will be available at the local address provided in your terminal (typically http://localhost:5173).
To create an optimized production build: npm run build
The built files will be located in the dist directory.
When you first open InkWell, you can create a new notebook from the welcome screen. The top navigation bar allows you to switch between the Notes, Split, and Canvas views.
To import a PDF, click the Import PDF button in the top bar. The document will be split into individual pages, which you can annotate and interact with on the canvas. Use the sidebar to manage your pages, change notebook settings, or export your work.
Contributions are welcome. Please ensure that any pull requests follow the existing code formatting and architecture patterns.
This project is open source and available under standard open source licensing terms.