Hello Partikle!

Published at 2024/11/05

PARTIKLE is a zero-dependency library for rendering floating particles

Maybe you didn't notice, but I've changed recently the way I render those floating particles on my website - I've built my own small library for it (and it's Open Source!! 🙌)

Usage is simple as its size (1.49kB! 😅) - just include its unpkg resource (<script src="https://unpkg.com/partikle"></script>) and you're ready to go!

<script src="https://unpkg.com/partikle"></script>
<div class="particle-canvas-wrapper" style="width: 100%; height: 100vh; position: relative; overflow: hidden;">
  <div class="particle-canvas"></div>
</div>
<script>
partikle({
  nodeId: 'particle-canvas',
  particleColor: '#fefefe',
  particlesAmount: 400
});
</script>

The only prerequisite is to add following styles for the wrapper node that will contain particles:

position: relative;
overflow: hidden;

You can check the source code here.

Enjoy!

-- Å‚.

Click here to show comments