Get started with konva CDN

MIT licensed

Konva: 2D web library for interactive graphics, JS UI creation.

Tags:
  • canvas
  • animations
  • graphic
  • html5

Stable version

Copied!

How to start using konva CDN


<!DOCTYPE html>
<html>
<head>
    <title>Get started with konva CDN - cdnhub.io</title>
    <script src="https://cdn.jsdelivr.net/npm/konva@9.3.6/konva.min.js"></script>
    <style>
        #container { width: 400px; height: 400px; border: 1px solid black; }
    </style>
</head>
<body>
    <div id="container"></div>
    <script>
        const stage = new Konva.Stage({
            container: 'container',
            width: 400,
            height: 400
        });

        const circle = new Konva.Circle({
            x: 100,
            y: 100,
            radius: 50,
            fill: 'red'
        });

        const text = new Konva.Text('Hello Konva.js', 150, 150);
        text.fontSize(24);
        text.fontFamily('Arial');
        text.align('center');

        stage.add(circle, text);
        stage.draw();
    </script>
</body>
</html>

All versions