Every mood has a place. Every feeling deserves to be heard.
Moodscape is a mood-tracking and self-reflection web application designed to help people understand their emotions, express their thoughts, and discover small activities that support their everyday well-being.
Whether you're having a wonderful day, feeling overwhelmed, or simply need a moment to yourself, Moodscape gives you a little space to pause, reflect, and reconnect with yourself.
- Choose from six different emotional states.
- Track the intensity of your current mood.
- Record your daily emotional experiences.
- Write down your thoughts and feelings.
- Keep track of personal reflections.
- Save journal entries alongside your mood records.
- Discover activities based on your selected mood.
- Get suggestions for relaxation, creativity, and self-care.
- Explore simple ways to make your day better.
- Receive positive and encouraging messages.
- Find reminders that encourage self-kindness and self-reflection.
- View previously saved mood entries.
- Track your mood check-ins.
- Review your recorded emotional experiences.
- Uses browser LocalStorage to save mood entries.
- Retains saved entries after refreshing the page.
- No backend or database setup required.
Moodscape is designed around a calm, minimal, and dreamy visual experience.
- Soft pastel gradients.
- Lavender and pink colour palette.
- Rounded cards and interactive elements.
- Responsive layouts for desktop and mobile.
- Simple navigation and beginner-friendly interactions.
The goal is to create an environment where users feel comfortable expressing themselves.
| Technology | Purpose |
|---|---|
| HTML5 | Application structure |
| CSS3 | Styling, layouts and animations |
| JavaScript | Application logic and interactivity |
| LocalStorage | Client-side data persistence |
| Google Fonts | Typography |
Follow these steps to run Moodscape locally.
git clone YOUR_REPOSITORY_URLcd MoodscapeOpen index.html in your browser.
Alternatively, use the Live Server extension in Visual Studio Code for a better development experience.
That's it! Moodscape is ready to explore.
Moodscape/
│
├── index.html
└── README.md
The current version keeps the HTML, CSS, and JavaScript together in one file for simplicity.
Moodscape is a growing project. Some planned improvements include:
- Weekly and monthly mood analytics.
- Interactive mood calendar.
- AI-powered reflection assistant.
- Personalized activity recommendations.
- Relaxation and meditation music.
- User authentication and profiles.
- Database integration for cross-device access.
- Dark mode.
- Mood trends and personalized insights.
The primary objective of Moodscape is to encourage emotional awareness and daily self-reflection through a simple, accessible, and interactive digital experience.
It aims to remind users that every emotion is valid and that taking care of yourself starts with understanding yourself.
Moodscape is an educational self-reflection and wellness project. It is not a substitute for professional mental health care, diagnosis, or treatment.
The current version stores information locally in the browser. Avoid entering sensitive personal information.
Himani
Computer Science Engineering Student
Interested in building creative, meaningful, and user-focused technology.
You don't have to be happy every day.
You just have to give yourself the space to feel, grow, and begin again.
Welcome to Moodscape. 🌷
⭐ If you like this project, consider giving the repository a star!