uitripled Component Library
135 animated, glassmorphism-inspired components for HAUS Appraisal
๐ Quick Installation
Install Top 10 Essentials
Get started with the most useful components
npx -y uitripled add \
native-button \
native-badge \
cards-slider \
hover-expand-card \
glass-blog-card \
glassmorphism-hero-block \
testimonials-block \
cash-flow-chart \
stocks-dashboard \
wizard-formInstall All 135 Components
Run the automated installation script
chmod +x scripts/install-uitripled-components.sh
./scripts/install-uitripled-components.shTakes ~10-15 minutes to install all components
๐ฆ Component Categories
Native Components
28Core UI elements with glassmorphism
- Buttons
- Badges
- Tooltips
- Dialogs
Blocks
36Full-width landing page sections
- Heroes
- CTAs
- Testimonials
- Footers
Cards
13Reusable card components
- Property Cards
- Tickets
- Wallets
- Sliders
Components
32Feature-rich UI components
- Chat
- Dashboards
- Auth
- Navigation
Page Transitions
11Scroll and animation effects
- Heroes
- Reveals
- Spotlights
- Stats
Data & Effects
15Charts, forms, and visual effects
- Charts
- Wizards
- Gradients
- Resumes
๐ฏ Top 10 for HAUS Appraisal
native-button
Primary CTAs across platform
cards-slider
Draggable property listings
hover-expand-card
Interactive property cards
glassmorphism-hero-block
Premium landing pages
cash-flow-chart
Financial data visualization
stocks-dashboard
Property portfolio dashboard
wizard-form
Multi-step onboarding
testimonials-block
Client reviews section
native-badge
Status indicators
glass-blog-card
Content/property cards
๐ก Usage Example
Installing and Using Components
Example: Using the native-button component
1. Install the component
npx -y uitripled add native-button2. Import and use in your code
import { NativeButton } from "@/components/native-button"
export function PropertyCTA() {
return (
<NativeButton
variant="glow"
onClick={() => console.log("Book appraisal")}
>
Book Your Appraisal
</NativeButton>
)
}3. Customize with props and Tailwind
<NativeButton
variant="glass"
className="w-full"
>
Get Started
</NativeButton>๐ Resources
Installation Guide
Step-by-step installation instructions
Component Index
Complete catalog of all 135 components
Official Website
Live previews and documentation
Ready to Get Started?
uitripled components are built on top of shadcn/ui and Framer Motion, making them perfectly compatible with HAUS Appraisal's tech stack (Next.js 16, React 19, Tailwind v4). All components feature glassmorphism effects, smooth animations, and are production-ready.
Start by installing the top 10 essentials, then gradually add more components as needed. Each component is standalone and can be customized with Tailwind classes.