doodlepad

a simple pad to doodle on

Usage no npm install needed!

<script type="module">
  import doodlepad from 'https://cdn.skypack.dev/doodlepad';
</script>

README

DoodlePad

good doodle pad

A simple doodle pad to use with canvas contexes

Demo

demo

Notes

Make sure the canvas container has this css applied to it

touch-action: none;

to prevent strokes from being mis-inputed and cancelled

Example

import { PaintingContext } from 'https://unpkg.com/doodlepad'

const canvas = document.createElement('canvas')
canvas.width = window.innerWidth
canvas.height = window.innerHeight

const ctx = canvas.getContext('2d')
const paint = new PaintingContext(ctx)

paint.strokeSize = 5
paint.strokeSmoothing = 0.5

document.body.appendChild(canvas)