nxui now has all 29 Paper Shaders as Vue/Nuxt components (they just went fully open source)
▲ 45 r/Nuxt+2 crossposts

nxui now has all 29 Paper Shaders as Vue/Nuxt components (they just went fully open source)

Paper Shaders (the WebGL shader library from paper.design, 1.7M npm downloads/month) dropped their restrictive license this week — it's now plain Apache-2.0, do whatever you like.

I'd been porting them to Vue 3 for nxui, so with the license cleared: all 29 shaders are now available as copy-paste Vue components — mesh gradient, liquid metal, god rays, dithering, metaballs, neuro noise, etc. Typed props, live playgrounds, installable via the shadcn-vue CLI. Works with Nuxt 4 out of the box (SSR-safe mounts).

Demos: https://nxui.geoql.in/docs/paper-shaders/paper-mesh-gradient

Repo (MIT, 210+ components total): https://github.com/vinayakkulkarni/nxui

Feedback welcome — especially on the WebGL/SSR handling.

u/vinayak-kulkarni — 3 days ago

nxui — 180+ animated, copy-paste UI components for Vue 3 (open source)

For the last few years I've been building Vue apps and kept re-implementing the same animated UI over and over — magnetic docks, scroll reveals, WebGL/shader backgrounds, cursor effects.

I finally pulled them into one place. nxui is ~180 animated components you add with the shadcn-vue CLI:

npx shadcn-vue@latest add "https://nxui.geoql.in/r/aurora.json"

The CLI copies the source into your repo — you own the code, it's not a runtime dependency you're locked into. Vue 3 + script setup, Tailwind v4, motion-v (the Vue port of Framer Motion), and ogl/three for the WebGL ones. MIT.

Full disclosure: it's a Vue port of componentry.fun and React Bits (reactbits.dev) — both React libraries, both credited in the README. I rebuilt each component in idiomatic Vue rather than wrapping React, and added a few of my own.

Genuinely after feedback on the component API — what animated bits do you find yourself rebuilding every project?

https://preview.redd.it/jxnko64cgg7h1.png?width=1920&format=png&auto=webp&s=d29acc62bc8d566b1c4ef70b75f1d5bd09b8e4f2

https://preview.redd.it/zmxwb84cgg7h1.png?width=1920&format=png&auto=webp&s=c1bdbf4616005a3a8dbad1ac6f94075a8af8ad91

https://preview.redd.it/o2j9b74cgg7h1.png?width=1920&format=png&auto=webp&s=3a4b63f34d3e8dd58a57bf1e2c1943050958be3f

https://preview.redd.it/x4z8164cgg7h1.png?width=1920&format=png&auto=webp&s=dee147d81b06f4159452c44d61530d1f76d34163

nxui.geoql.in
u/vinayak-kulkarni — 19 days ago
▲ 86 r/shadcn+2 crossposts

nxui — 180+ animated, copy-paste UI components for Vue 3 (open source)

For the last few years I've been building Vue apps and kept re-implementing the same animated UI over and over — magnetic docks, scroll reveals, WebGL/shader backgrounds, cursor effects. I finally pulled them into one place.

nxui is ~180 animated components you add with the shadcn-vue CLI:

npx shadcn-vue@latest add "https://nxui.geoql.in/r/aurora.json"

The CLI copies the source into your repo — you own the code, it's not a runtime dependency you're locked into. Vue 3 + script setup, Tailwind v4, motion-v (the Vue port of Framer Motion), and ogl/three for the WebGL ones. MIT.

Full disclosure: it's a Vue port of componentry.fun and React Bits (reactbits.dev) — both React libraries, both credited in the README. I rebuilt each component in idiomatic Vue rather than wrapping React, and added a few of my own.

Live demos + copy-paste source for everything: https://nxui.geoql.in

Genuinely after feedback on the component API — what animated bits do you find yourself rebuilding every project?

https://preview.redd.it/jxnko64cgg7h1.png?width=1920&format=png&auto=webp&s=d29acc62bc8d566b1c4ef70b75f1d5bd09b8e4f2

https://preview.redd.it/zmxwb84cgg7h1.png?width=1920&format=png&auto=webp&s=c1bdbf4616005a3a8dbad1ac6f94075a8af8ad91

https://preview.redd.it/o2j9b74cgg7h1.png?width=1920&format=png&auto=webp&s=3a4b63f34d3e8dd58a57bf1e2c1943050958be3f

https://preview.redd.it/x4z8164cgg7h1.png?width=1920&format=png&auto=webp&s=dee147d81b06f4159452c44d61530d1f76d34163

reddit.com
u/vinayak-kulkarni — 19 days ago