https://github.com/payal033/nutrinook
This project is a learning-focused website layout for a food subscription service, designed and developed using HTML5 and CSS3.
https://github.com/payal033/nutrinook
css-flexbox css-grid css3 html5 modern-landing-page
Last synced: 18 days ago
JSON representation
This project is a learning-focused website layout for a food subscription service, designed and developed using HTML5 and CSS3.
- Host: GitHub
- URL: https://github.com/payal033/nutrinook
- Owner: payal033
- Created: 2024-10-14T10:21:54.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-01-02T13:29:02.000Z (about 1 year ago)
- Last Synced: 2025-01-02T14:28:04.671Z (about 1 year ago)
- Topics: css-flexbox, css-grid, css3, html5, modern-landing-page
- Language: HTML
- Homepage: https://payal033.github.io/Nutrinook/
- Size: 5.54 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Nutrinook
## Overview
This learning based project is a responsive food subscription website built using **HTML5** and **CSS3**. It showcases modern web design principles and implements various features to provide an engaging user experience. This website is designed to simulate a food delivery service where users can subscribe to curated meal plans.
### [Demo](https://payal033.github.io/Nutrinook/)
---
## Features
1. **Modern Landing Page:**
- An appealing homepage with high-quality visuals and an intuitive layout.
- A hero section with an engaging call-to-action for users to explore subscription options.
2. **Responsive Design:**
- Fully responsive layout that adapts seamlessly across devices (desktop, tablet, and mobile).
- Utilizes CSS3 media queries to ensure optimal viewing on all screen sizes.
3. **Subscription Plans:**
- Section showcasing different meal plans with pricing and benefits.
- Clean and organized card layout for easy comparison.
4. **Navigation:**
- Sticky navigation bar for quick access to different sections of the website.
- Smooth scroll behavior for a seamless browsing experience.
5. **Contact Form:**
- A basic contact form for users to submit inquiries or subscription requests.
- Validated form fields to ensure a smooth user experience.
6. **Footer Section:**
- Contains social media links and additional information about the service.
- Designed with accessibility and clarity in mind.
---
## Technologies Used
- **HTML5:** Semantic structure and organization for a clean and accessible website.
- **CSS3:** Styling and layout with advanced CSS features, including:
- Flexbox and Grid for responsive layouts.
- Animations and transitions for enhanced user engagement.
---
## How to Use
1. Clone or download the repository:
```bash
git clone https://github.com/payal033/Nurtrinook.git
2. Open the index.html file in any modern web browser.