Guides
Tutorials, deep dives, and practical tips on React, Tailwind CSS, and UI patterns.
Using Components and UI Kit in Your Project
A complete walkthrough of adding Froiden UI components and UI Kit primitives to a React or HTML project — from prerequisites to customization, with real examples.
Scroll-Driven Animations with Framer Motion
Build cinematic scroll effects in React using Framer Motion's useScroll, useTransform, and useSpring hooks — no scroll libraries needed.
Getting Started with Froiden UI
Learn how to install and use Froiden UI components in your React or HTML project. Copy, paste, and customize production-ready components in minutes.
5 Text Animation Techniques in React
Learn how to create stunning text animations in React using Framer Motion, CSS, and Canvas — from typewriter effects to glitch distortion.
Froiden UI vs shadcn/ui: Animation-First vs Utility-First Components
Comparing Froiden UI's animated, visual components with shadcn/ui's headless, accessible primitives — and when to use each.
Froiden UI vs Aceternity UI: Which Component Library Should You Choose?
A detailed comparison of Froiden UI and Aceternity UI — pricing, component quality, animation capabilities, and developer experience.
Froiden UI vs Material UI (MUI): Lightweight Tailwind vs Enterprise Design System
Comparing Froiden UI's lightweight, copy-paste Tailwind components with Material UI's enterprise-grade React component library.
Froiden UI vs Chakra UI: Tailwind Copy-Paste vs Runtime CSS-in-JS
Comparing Froiden UI's zero-runtime Tailwind approach with Chakra UI's runtime CSS-in-JS system — architecture, performance, and use cases.