Radia β AI Beauty Assistant UI Template
$15
$15
https://schema.org/InStock
usd
Wabtech
π Radia β AI Beauty Assistant UI Template
Live Demo
Radia is a beautiful and intelligent SaaS frontend UI template tailored for skincare, beauty tech, and wellness platforms. Built with Next.js 14, Tailwind CSS 3, and Shadcn UI, Radia combines elegant design with AI-driven UX patterns to empower users with personalized skincare insights, routine planning, and product recommendations.
β¨ UI & Usability Highlights
- β Modern, clean UI with accessible components
- π Supports Dark Mode
- π± Fully responsive for all screen sizes
- π¨ Subtle animations and aesthetic gradients
- π Built-in chart components for data visualization
- π§Ό Organized, scalable codebase
- π API-ready and easy to customize
- π§ Intuitive navigation for beauty-focused experiences
π Core AI & Beauty Features (UI-ready)
- π§ AI-powered insights based on userβs skin profile
- π§΄ Personalized skincare routine generator via AI
- ποΈ Product recommendations tailored to skin type/concerns
- π Skincare analytics and usage patterns
- πΌοΈ Realtime Skin Image Analysis β upload face image, get AI feedback
- π¬ AI Skincare Chat Assistant:
- Chat about skincare routines
- Upload image in chat and get AI analysis inline
- Receive product suggestions directly inside chat
- π Skin Journal for tracking routines, reactions, and improvements
π Getting Started
-
Download & Unzip
After purchasing and downloading the ZIP file, unzip it. Inside, youβll find a folder named:radia
-
Navigate to the Project
Open your terminal or command line, and navigate to the folder:cd radia
-
Install Dependencies
Run the following command to install all required packages:npm install
-
Run the Development Server
Once installation completes, start the development server:npm run dev
-
Visit the App
Open your browser and visit:http://localhost:3000 -
Start Customizing
Open the project in your favorite code editor (e.g., VS Code) and begin customizing:- π¨ Change Colors: Update color palette in
tailwind.config.ts
or use global Find & Replace - π Change Fonts: Update fonts in global styles or Tailwind config
- π Add Pages or Components: Extend UI from the organized
components/
andapp/
folders - βοΈ Integrate APIs: Hook up real data by integrating your backend endpoints
- π¨ Change Colors: Update color palette in
Source code
Size
811 KB
Add to wishlist