https://github.com/valentinmadiot/gallery-movies_css

Galerie responsive dédiée aux films cultes des années 90 et 2000. Mosaïque fluide en HTML/CSS pur, effets de survol dynamiques, ratios variés pour un rendu cinématographique immersif et inspirant.
https://github.com/valentinmadiot/gallery-movies_css

brightness cinema-scenes css-flexbox-layout css-gallery cult-movies frontend gallery-images gallery-layout hover-effects html-css-only html5-css3 image-mosaic media-queries modern-gallery modern-layout movies-gallery pure-css-ui responsive-gallery responsive-ui webp-images

Last synced: 4 months ago
JSON representation

Galerie responsive dédiée aux films cultes des années 90 et 2000. Mosaïque fluide en HTML/CSS pur, effets de survol dynamiques, ratios variés pour un rendu cinématographique immersif et inspirant.

• Host: GitHub
• URL: https://github.com/valentinmadiot/gallery-movies_css
• Owner: ValentinMadiot
• Created: 2025-06-09T19:22:25.000Z (about 1 year ago)
• Default Branch: main
• Last Pushed: 2025-07-06T17:32:32.000Z (12 months ago)
• Last Synced: 2025-10-23T18:42:21.301Z (8 months ago)
• Topics: brightness, cinema-scenes, css-flexbox-layout, css-gallery, cult-movies, frontend, gallery-images, gallery-layout, hover-effects, html-css-only, html5-css3, image-mosaic, media-queries, modern-gallery, modern-layout, movies-gallery, pure-css-ui, responsive-gallery, responsive-ui, webp-images
• Language: HTML
• Homepage: https://gallery-movies.netlify.app/
• Size: 15.4 MB
• Stars: 0
• Watchers: 0
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          


  

    

  

  

  
🎬 Galerie d'Images  –  Films Cultes



## 
 📌 Sommaire

    🎨   [**Introduction**](#introduction)


    🛠️   [**Technologies**](#technologies)


    🎯   [**Fonctionnalités**](#fonctionnalités)


    🚀   [**Installation**](#installation)


## 
 🎨 Introduction

Galerie visuelle rendant hommage au cinéma culte des années 90 et 2000, à travers une mosaïque responsive élégamment construite en HTML et CSS pur.

Chaque image adopte un format spécifique (1:1, 5:4, 16:9) pour créer un rythme visuel cinématographique et captivant.

Parfait pour une landing page artistique, une archive d’inspiration ou un hommage immersif à l’univers du 7ᵉ art.

## 
 🛠️ Technologies

- HTML5 sémantique et accessible

- CSS3 moderne avec Flexbox et media queries

- Filtres CSS pour effets de survol

- Structure responsive fluide sans frameworks

- Images .webp optimisées pour la performance

## 
 🎯 Fonctionnalités

- Grille d’images flexible et auto-adaptative

- Filtres de luminosité dynamiques au survol

- Ratio d’images mixés pour un effet cinématographique

- Responsive mobile et desktop optimisé

- Mosaïque continue avec flex-grow

- Expérience visuelle cohérente et immersive

- Code minimaliste sans dépendance externe

## 
 🚀 Installation

### ✅ Prérequis

- [Google Chrome](https://www.google.com/)  —  Navigateur moderne

- [Visual Studio Code](https://code.visualstudio.com/)  —  Éditeur de code

- [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer)  —  Extension VS Code

### 📥 Cloner le projet

```bash

git clone https://github.com/ValentinMadiot/gallery-movies_css

cd gallery-movies_css

```

### ▶️ Lancer le projet

Ouvre simplement le fichier `index.html` dans ton navigateur, ou utilise l’extension **Live Server** pour une prévisualisation dynamique.