Muffy

A static website showcasing a modern, responsive design using HTML, CSS, and Bootstrap. Features include interactive UI elements, smooth navigation, and user-friendly layout. Developed to provide a clean and engaging web experience with a focus on aesthetics

#bootstrap5#bulma-css-framework#css3#html5#javascript

View Repository on GitHub ↗

REPOSITORY OVERVIEW

Live repository statistics

★ 0Stars

⑂ 0Forks

◯ 0Open issues

◉ 0Watchers

README preview

Muffy - Premium Dessert & Confectionery Website

Welcome to Muffy, an elegant, modern, and fully responsive frontend web application designed for a premium dessert and confectionery brand. This project showcases highly polished user interfaces, rich design aesthetics, and micro-interactions optimized for web experience.

Live Demo: muffy-website.vercel.app (formerly Spark)

Key Features

Gourmet Design Aesthetic: A visually stunning interface utilizing modern typography, harmonious warm color palettes, smooth gradient transitions, and responsive grid layouts.
Responsive Architecture: Fully optimized for seamless browsing across desktops, tablets, and mobile devices.
Interactive User Flows: Enhanced with smooth animations, custom image transitions, and interactive product modals.
Extensive Product Catalog: Categorized showcasing of premium desserts, cupcakes, and cookies with detailed layout specifications.
Bespoke Branding & Identity: Custom assets, tailored iconography, and a beautiful cupcake favicon.

Technology Stack

Structure: HTML5 (Semantic and SEO-optimized markup)
Styling: Custom Vanilla CSS3 (Flexible layouts, animations, transitions)
Logic & Interactions: Vanilla JavaScript (Dynamic menu toggling, interactive components)
Fonts & Iconography: Google Fonts (Open Sans, Material Symbols Outlined), Font Awesome

Project Structure

├── about.css          # Styling for the About page
├── about.html         # About Us page
├── buy_product.css    # Styling for the Product detail page
├── buy_product.html   # Product detail page
├── contact.css        # Styling for the Contact page
├── contact.html       # Contact Us page
├── cupcake.png        # Brand favicon / assets
├── index.css          # Styling for the Home page
├── index.html         # Home page
├── p.css              # Styling for the Products showcase
└── p.html             # Products catalog page

Getting Started

Prerequisites

To run this project locally, you only need a modern web browser.

Installation & Local Run

Clone the repository:

git clone https://github.com/fatima-Sami55/SugarSpark_Website.git
cd SugarSpark_Website

Run locally: Simply open index.html in any browser, or use a local development server like Live Server (VS Code Extension):
```
# If you have Node.js / npx installed:
npx serve .
```

Contribution

Contributions, bug reports, and feature requests are welcome! Feel free to open issues or submit pull requests to enhance the visual polish or interactivity of the website.

License

This project is open-source and available under the MIT License.