Skip to content

About

Static Netflix India homepage clone in pure HTML & CSS - membership hero, ranked Trending Now carousel and 10 themed movie sections with custom artwork. Responsive, zero frameworks, auto-deploys to GitHub Pages.

Topics

Resources

Security policy

Stars

0 stars

Watchers

0 watching

Forks

Repository files navigation

Netfly — Netflix Homepage Clone

A pixel-styled static clone of the Netflix India homepage in pure HTML & CSS

HTML5 CSS3 Static GitHub Pages Responsive


📖 Overview

Netfly is a static, visually faithful recreation of the Netflix India homepage — built with nothing but HTML and CSS (plus a pinch of inline JS for the carousel). It reproduces the signature Netflix look: dark theme, red accents, a membership hero with email CTA, a ranked "Trending Now" carousel, and 10 themed movie & show sections, each with its own custom poster, background and font artwork.

All assets are stored locally, so the page loads instantly with no external dependencies — and it auto-deploys to GitHub Pages on every push to main.

✨ Features

  • Netflix-style navbar — logo, language selector (English / हिन्दी) and red Sign-In button
  • Membership hero — "Unlimited movies, TV shows and more", ₹149 pricing line, email input + Get Started CTA with the signature arrow icon
  • Ranked "Trending Now" carousel — numbered posters (1, 2, 3, …) with prev/next arrow controls and smooth horizontal scrolling (scrollCarousel())
  • 10 themed sections, each with dedicated poster / background / font images: Chaava · Great Indian · Hit · Jaat · Raid · Rana Naidu · Retro · Squid Game · The Royals · Thug Life
  • Hover effects on posters and buttons
  • Responsive layout — media queries adapt the page from desktop down to mobile
  • Footer in classic Netflix multi-column style
  • Zero frameworks, zero build — open index.html and it works

📁 Folder Structure

Netfly---Homepage-Clone-Of-NETFLIX/
├── index.html              # The full homepage
├── style.css               # All styling, hover effects & responsive rules
├── favicon.ico
├── bg/                     # Netflix logo SVG + hero background
├── chaava/                 # ┐
├── greatindian/            # │
├── hit/                    # │  one folder per themed section:
├── jaat/                   # │  poster, background and font images
├── raid/                   # │
├── rananaidu/              # │
├── retro/                  # │
├── squidgame/              # │
├── theroyals/              # │
├── thuglife/               # ┘
├── .github/workflows/
│   └── static.yml          # Auto-deploy to GitHub Pages
└── SECURITY.md

🚀 Run It

Local: open index.html in any browser — no server required.

Live: the site deploys automatically via the included GitHub Pages workflow (.github/workflows/static.yml) on every push to main, at https://princekumar-dev.github.io/Netfly---Homepage-Clone-Of-NETFLIX/.

Local preview with a server (optional):

npx serve .
# or: python -m http.server

🎨 Customization

  • Add a section: create a new folder with its images, then add the corresponding markup in index.html and styles in style.css
  • Swap artwork: replace the images inside any section folder (keep the same filenames)
  • Tweak the theme: colors, spacing and hover behaviour all live in style.css

⚠️ Disclaimer

All images and assets are for demonstration and educational purposes only. This project is inspired by the Netflix UI and is not affiliated with, endorsed by, or connected to Netflix, Inc.

👤 Author

Prince Kumar — @princekumar-dev


Netfly — Netflix's homepage, rebuilt one div at a time.

About

Static Netflix India homepage clone in pure HTML & CSS - membership hero, ranked Trending Now carousel and 10 themed movie sections with custom artwork. Responsive, zero frameworks, auto-deploys to GitHub Pages.

Topics

Resources

Security policy

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages