<div class="editor" />

body {
  margin: 0;
  padding: 0;
}

.editor {
  width: 100%;
  height: 100vh;
  background: #eee;
}

import * as pikaso from "https://cdn.skypack.dev/[email protected]";

const editor = new Pikaso({
  container: document.querySelector('.editor'),
  selection: {
    transformer: {
      borderStroke: '#262626',
      anchorColor: '#262626',
      anchorStroke: '#262626',
      anchorFill: '#262626',
      anchorSize: 10
    }
  },
  measurement: {
    background: {
      fill: 'purple',
      cornerRadius: 5
    },
    text: {
      fill: '#fff',
      padding: 5,
      fontSize: 14,
      fontStyle: 'bold'
    }
  }
})

editor.shapes.pencil.draw({
  stroke: 'tomato',
  strokeWidth: 10
 })