A beautifully animated emotional wellness platform that helps users explore, visualize, and understand their feelings through interactive mood tracking, 3D visualizations, and personalized insights.
- 20+ Emotional States: From happiness to melancholy, each with unique colors and personalities
- Floating Card Interface: Disney-inspired 3D animations with shimmer and hover effects
- Intuitive Design: Beautiful gradient backgrounds and smooth transitions
- Dynamic Visualization: Interactive orbs that change color, glow, and animation based on selected mood
- Particle Effects: Floating particles and ripple rings for immersive experience
- Responsive Animations: Smooth Framer Motion animations with customizable states
- Journal Prompts: Thoughtful questions tailored to your emotional state
- Inspirational Quotes: Curated quotes from renowned authors and thinkers
- Keyword Clouds: Emotion-related words to expand emotional vocabulary
- Music Recommendations: Spotify-style playlists matching your mood
- Mood Tracking: Visual charts showing emotional patterns over time
- Statistics: Daily, weekly, and overall mood insights
- Recent Activity: Timeline of your emotional journey
- Progress Visualization: Beautiful bar and pie charts
- Curated Playlists: Genre-specific music recommendations for each mood
- Interactive Player: Play/pause functionality with beautiful UI
- Mood-Based Organization: Easy switching between emotional soundscapes
- Frontend: Next.js 13 with App Router
- Styling: TailwindCSS with custom design system
- Animations: Framer Motion for smooth, professional animations
- Icons: Lucide React for consistent iconography
- Data Storage: Local Storage for client-side persistence
- TypeScript: Full type safety throughout the application
InnerHue follows Apple-level design aesthetics with:
- Glassmorphism: Backdrop blur effects and translucent cards
- Micro-interactions: Subtle hover states and tap feedback
- Color Psychology: Carefully chosen colors that match emotional states
- Responsive Design: Mobile-first approach with perfect cross-device experience
- Accessibility: High contrast ratios and intuitive navigation
- Clone the repository
git clone https://github.com/Nitya-003/innerhue.git
cd innerhue- Install dependencies
npm install- Run the development server
npm run devInnerHue uses a comprehensive emotional color palette:
- Happy: Golden yellows (#FFD93D)
- Calm: Peaceful greens (#66BB6A)
- Sad: Soothing blues (#42A5F5)
- Excited: Vibrant purples (#AB47BC)
- Anxious: Warm oranges (#FF7043)
- Backend Integration: Express.js API with MongoDB
- Real NLP: OpenAI or Cohere integration for dynamic suggestions
- Social Features: Share insights with friends and family
- Voice Journaling: Audio recordings with sentiment analysis
- Meditation Timer: Guided meditation based on current mood
- Wearable Integration: Apple Watch and Fitbit mood tracking
We welcome contributions! Please feel free to submit a Pull Request. For major changes, please open an issue first to discuss what you would like to change.
This project is licensed under the MIT License - see the LICENSE file for details.
- Framer Motion for incredible animation capabilities
- TailwindCSS for the flexible design system
- Next.js for the amazing developer experience
- Inspiration from emotional wellness platforms and modern design trends
InnerHue - Discover the colors of your emotions 🌈✨