Skip to content

Latest commit

Β 

History

History
113 lines (74 loc) Β· 3.11 KB

File metadata and controls

113 lines (74 loc) Β· 3.11 KB

🍳 Recipe Page β€” A Page So Pretty You’ll Want to Cook (Maybe)

This is a beautiful, clean, minimalist Recipe Page UI β€” the kind you see on those fancy cooking blogs where everything looks calm, no onions are ever accidentally burned, and somehow everyone has fresh rosemary at home. 🌿😌

Live Demo β†’ https://recipepagechallengeres.netlify.app/


🍽️ What’s This Project?

A Frontend Mentor challenge where the goal was to create a simple, single recipe page with:

  • Ingredient list
  • Preparation steps
  • Cook / prep time
  • Visual structure that doesn’t scream "I just learned HTML yesterday" 😭

And yes… it’s fully responsive so you can follow the recipe while cooking & crying in the kitchen. πŸœπŸ’§


✨ Features

  • πŸ₯— Clean layout with well-structured recipe sections
  • 🎨 Soft + elegant visual design (chef-approved βœ…)
  • πŸ“± Mobile-first responsive styling
  • πŸ“š Readable typography β€” like actually readable
  • πŸ’¨ Loads instantly (lighter than your emotional baggage)

🧠 Tech Stack

Ingredient Purpose
HTML Main structure (the plate) 🍽️
CSS Styling & seasoning (the salt) πŸ§‚
Responsive CSS Makes sure it doesn’t break like your roti πŸ«“

Frameworks Used: None Why? Because this is pure handcrafted design, like homemade chai β˜•βœ¨


πŸš€ Live Preview

πŸ‘‰ https://recipepagechallengeres.netlify.app/

Open it, scroll slow, pretend you’re a calm person.


πŸ—οΈ File Structure

Recipe-Page/
│── index.html       # The recipe layout
└── style.css        # Fancy styling, spacing & responsiveness

πŸ“¦ Run Locally

git clone https://github.com/Divyamsharma-18/Recipe-Page.git
cd Recipe-Page
# Open index.html in your browser ✨

Simple. No npm. No β€œwhy is node_modules 400MB?” trauma.


πŸͺ„ UI Vibes

This page feels like:

  • Sunday morning
  • Clean kitchen
  • Peaceful lo-fi music playing
  • You actually having your life together (temporarily)

πŸ‘©β€πŸ³ Author

Divyam Sharma
🌐 Portfolio β€” https://divyamsharma.netlify.app
πŸ’» GitHub β€” https://github.com/Divyamsharma-18
🐦 Twitter β€” https://x.com/Heydivyamsharma

Writes CSS with the same love people reserve for homemade parathas. 🫢


⭐ Show Some Support

If you appreciate good spacing, calm vibes, or recipes that don’t require 46 ingredients, Consider starring the repo ⭐

It helps nourish the soul. Just like food. πŸ₯ΉπŸ²


Bon Appétit! Go cook something delicious (or just stare at the UI again, that works too) 😭✨ Image