Guides
Hands-on guides from the WebberUI team on using animated components, full-page templates and the WebberUI registry in your own React and Next.js projects.
Three ways to build an animated gradient border in Tailwind
Three CSS techniques for an animated gradient border: a rotating conic-gradient layer, an @property angle animation and a mask cut-out, in Tailwind v4.
WebberUI vs Aceternity UI vs Magic UI vs React Bits: animated React component libraries compared
WebberUI, Aceternity UI, Magic UI and React Bits compared on install method, licence, dependencies, component counts, paid plans and languages.
Choosing a React animation library in 2026: Motion, GSAP, React Spring, and component libraries
Motion, GSAP and React Spring compared on API style, bundle size, licence and Next.js App Router usage, and where animated component libraries fit in.
Parallax scrolling in React: CSS, Motion's useScroll, and ready-made components
Three ways to make a React parallax scroll effect, with October 2026 browser support for CSS scroll-driven animations, plus performance and reduced-motion tips.
Building an infinite marquee with Tailwind CSS (pause, reverse, reduced motion)
An infinite marquee in Tailwind CSS v4 and React: @theme keyframes, pause on hover and focus, reverse, edge fade, a pause button and reduced motion.
Validating Taiwan national ID numbers in React
The Taiwan national ID check digit explained, including the letter table, weights, and 2021 resident certificate format, plus a tested TypeScript validator.
Validating Taiwan business tax IDs (UBN) in React: the 2023 rule
How Taiwan's 8-digit Unified Business Number check digit works, why the 2023 divisible-by-5 rule breaks old validators, and a tested TypeScript function.