Examples

Working examples and integrations built with SketchAPI.

---

Basic Drawing App

A minimal canvas with brush tools and export:

import { Sketchpad } from '@sketchapi/sketchpad'

const sketchpad = new Sketchpad({
  canvas: { renderMode: 'svg' },
  ui: {
    PrimaryToolbar: { enabled: true },
    ExportPane: { enabled: true }
  }
})

document.getElementById('app').appendChild(sketchpad)
await sketchpad.load()

---

Digital Whiteboard

A collaborative whiteboard with shape tools and text:

import { Sketchpad } from '@sketchapi/sketchpad'

const whiteboard = new Sketchpad({
  canvas: {
    renderMode: 'svg',
    defaultStyles: {
      strokeColor: '#333',
      fillColor: 'transparent',
      strokeWidth: 2
    }
  },
  settings: {
    autosave: 0,
    restoreSettings: true,
    history: { limit: -1, canUndo: true, canRedo: true }
  },
  ui: {
    PrimaryToolbar: {
      enabled: true,
      primaryCommands: ['select', 'brush', 'shape', 'text', 'eraser']
    },
    SettingsPane: { enabled: true }
  }
})

document.getElementById('app').appendChild(whiteboard)
await whiteboard.load()

---

Community Examples

Live apps built with SketchAPI:

• Sketchpad — Official full-featured demo
• Logo Maker — Logo design tool
• Mandala Maker — Mandala drawing tool
• Draw Meow — Cat-themed drawing app