DEV Community

Nandan Das
Nandan Das

Posted on

NandanX — The Frontend Library That Makes Websites Feel Alive

#showdev #opensource #frontend #javascript

I Built a Frontend Library That Feels Like “Frontend Superpowers”

Most frontend libraries solve one problem.

Animation.

Particles.

Cursor effects.

Forms.

Microinteractions.

Glassmorphism.

Gradients.

Scroll reveals.

I wanted something different.

So I started building NandanX — a frontend library focused on making websites feel alive with almost no setup.

GitHub: https://github.com/nandandas2407-web/NandanX

npm: https://www.npmjs.com/package/nandanx

What is NandanX?

NandanX is a lightweight JavaScript UI/FX library designed for developers who want cinematic and modern interfaces without spending hours configuring animations or visual systems.

The idea is simple:

<script src="https://cdn.jsdelivr.net/npm/nandanx"></script>
Enter fullscreen mode Exit fullscreen mode

Or install with npm:

npm install nandanx
Enter fullscreen mode Exit fullscreen mode

Then:

NandanX.cursorTrail()
NandanX.meshGradient()
NandanX.glow()
NandanX.reveal()
Enter fullscreen mode Exit fullscreen mode

And suddenly your website feels premium.

Why I Started Building It

I noticed something while making projects.

Modern websites often need:

  • smooth interactions
  • animated backgrounds
  • futuristic effects
  • better hover states
  • microinteractions
  • cursor systems
  • aesthetic UI polish

But setting all of this up usually means:

  • installing multiple libraries
  • writing tons of CSS
  • configuring animation systems
  • dealing with performance issues

I wanted a single toolkit focused on:

  • speed
  • aesthetics
  • simplicity
  • instant visual impact

Some Features

Cursor Engine 

NandanX.cursorTrail()
Enter fullscreen mode Exit fullscreen mode

Adds smooth cinematic cursor trails instantly.

Mesh Gradient Engine 

NandanX.meshGradient()
Enter fullscreen mode Exit fullscreen mode

Creates animated premium-looking backgrounds.

Reveal Animations 

NandanX.reveal()
Enter fullscreen mode Exit fullscreen mode

Scroll-based reveals with minimal setup.

Glow Effects 

NandanX.glow()
Enter fullscreen mode Exit fullscreen mode

Adds modern glowing UI effects for cards, buttons, and sections.

Particle Engine 

NandanX.particles()
Enter fullscreen mode Exit fullscreen mode

Interactive particles without needing a huge framework.

My Goal

I’m not trying to replace huge frameworks like GSAP or Framer Motion.

NandanX is more about:

“Making beautiful frontend experiences ridiculously easy.”

Especially for:

  • portfolios
  • landing pages
  • indie hacker products
  • AI-generated websites
  • startup showcases
  • futuristic UI projects

Biggest Challenge

The hardest part is balancing:

  • performance
  • bundle size
  • developer experience
  • flexibility

while still keeping the library fun and expressive.

I’m currently working on:

  • better documentation
  • live demos
  • performance improvements
  • modular builds
  • TypeScript support

What I Learned Building This

Building a library is very different from building an app.

You’re not just writing code.

You’re designing:

  • APIs
  • developer experience
  • naming systems
  • documentation
  • ecosystem thinking

A small API naming decision can affect thousands of developers later.

That changed how I think about software engineering.

Future Plans

Some things I want to add:

  • plugin ecosystem
  • visual playground
  • shader effects
  • advanced motion presets
  • mobile optimization
  • AI-assisted UI generation
  • theme systems
  • component packs

Final Thoughts

NandanX started as an experiment.

Now it’s becoming a real ecosystem.

Still early. Still improving. Still learning.

But building it has taught me more about frontend engineering, DX,

Top comments (0)