{"id":29211929,"url":"https://github.com/valentinmadiot/img-hover-effects_css","last_synced_at":"2025-07-02T22:06:09.207Z","repository":{"id":299496233,"uuid":"934910483","full_name":"ValentinMadiot/img-hover-effects_css","owner":"ValentinMadiot","description":"Composants UI animés en HTML et CSS, avec effets de survol fluides et design responsive. Idéal pour sublimer visuellement vos interfaces web, portfolios, galeries ou pages de présentation.","archived":false,"fork":false,"pushed_at":"2025-06-26T12:04:25.000Z","size":2016,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-06-26T12:35:16.791Z","etag":null,"topics":["animation","animation-css","card-hover","component-ui","creative-ui","design","effects","frontend","gallery-images","hover-effect","html-css-project","image-cards","interactive-cards","landing-page","minimalist","modern-ui","no-js","responsive-design","ui-components","webdesign"],"latest_commit_sha":null,"homepage":"https://image-hover-effects-1.netlify.app/","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ValentinMadiot.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-02-18T15:49:05.000Z","updated_at":"2025-06-26T12:04:28.000Z","dependencies_parsed_at":"2025-06-26T12:41:06.381Z","dependency_job_id":"ef98e144-ce47-4624-8567-561461207b91","html_url":"https://github.com/ValentinMadiot/img-hover-effects_css","commit_stats":null,"previous_names":["valentinmadiot/card-hover-effects_css","valentinmadiot/img-hover-effects_css"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/ValentinMadiot/img-hover-effects_css","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ValentinMadiot%2Fimg-hover-effects_css","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ValentinMadiot%2Fimg-hover-effects_css/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ValentinMadiot%2Fimg-hover-effects_css/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ValentinMadiot%2Fimg-hover-effects_css/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ValentinMadiot","download_url":"https://codeload.github.com/ValentinMadiot/img-hover-effects_css/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ValentinMadiot%2Fimg-hover-effects_css/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":263222458,"owners_count":23433028,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["animation","animation-css","card-hover","component-ui","creative-ui","design","effects","frontend","gallery-images","hover-effect","html-css-project","image-cards","interactive-cards","landing-page","minimalist","modern-ui","no-js","responsive-design","ui-components","webdesign"],"created_at":"2025-07-02T22:06:07.507Z","updated_at":"2025-07-02T22:06:09.194Z","avatar_url":"https://github.com/ValentinMadiot.png","language":"CSS","readme":"\u003cdiv align=\"center\"\u003e  \n  \u003ca href=\"https://image-hover-effects-1.netlify.app/\" target=\"_blank\"\u003e  \n    \u003cimg src=\".docs/preview.png\" alt=\"Aperçu des effets de survol des images\"\u003e  \n  \u003c/a\u003e  \n  \u003c/br\u003e\u003c/br\u003e  \n  \u003ch3 align=\"center\"\u003e🏞 Effet de Survol d'Images\u003c/h3\u003e  \n\u003c/div\u003e\n\n## \u003cbr /\u003e 📌 Sommaire\n\n\u0026nbsp;\u0026nbsp;\u0026nbsp; 🎨 \u0026nbsp; [**Introduction**](#introduction)\u003cbr /\u003e\n\u0026nbsp;\u0026nbsp;\u0026nbsp; 🛠️ \u0026nbsp; [**Technologies**](#technologies)\u003cbr /\u003e\n\u0026nbsp;\u0026nbsp;\u0026nbsp; 🎯 \u0026nbsp; [**Fonctionnalités**](#fonctionnalités)\u003cbr /\u003e\n\u0026nbsp;\u0026nbsp;\u0026nbsp; 🚀 \u0026nbsp; [**Installation**](#installation)\u003cbr /\u003e\n\n## \u003cbr /\u003e \u003ca name=\"introduction\"\u003e🎨 Introduction\u003c/a\u003e\n\nComposants d'images interactives animées en HTML et CSS pur avec effet de survol dynamique.\n\nChaque image associe un visuel attractif, un texte descriptif et un bouton d'action, le tout révélé élégamment au survol.\n\nDesign responsive, animations fluides en pur CSS, parfait pour portfolios, galeries, etc...\n\n## \u003cbr /\u003e \u003ca name=\"technologies\"\u003e🛠️ Technologies\u003c/a\u003e\n\n- HTML5 structuré et sémantique\n- CSS3 moderne (variables CSS, media queries, animations)\n- Responsive Design avec breakpoints\n- Aucune dépendance JS : 100% CSS natif\n\n## \u003cbr /\u003e \u003ca name=\"fonctionnalités\"\u003e🎯 Fonctionnalités\u003c/a\u003e\n\n- Apparition animée du texte lors du survol de l’image\n- Design responsive multi-colonnes : 1, 2 ou 3 images selon la taille d’écran\n- Transitions douces et effets CSS : `@keyframes`, `:hover`\n- Images et données facilement modifiables\n- Aucune librairie externe requise\n\n## \u003cbr /\u003e \u003ca name=\"installation\"\u003e🚀 Installation\u003c/a\u003e\n\n### ✅ Prérequis\n\n- [Google Chrome](https://www.google.com/) \u0026nbsp;—\u0026nbsp; Navigateur moderne\n- [Visual Studio Code](https://code.visualstudio.com/) \u0026nbsp;—\u0026nbsp; Éditeur de code\n- [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer) \u0026nbsp;—\u0026nbsp; Extension VS Code\n\n### 📥 Cloner le projet\n\n```bash\ngit clone https://github.com/ValentinMadiot/img-hover-effects_css\ncd img-hover-effects_css\n```\n\n### ▶️ Lancer le projet\n\nIl suffit d’ouvrir le fichier `index.html` dans un navigateur, ou d’utiliser l’extension **Live Server** sur VS Code pour un aperçu dynamique.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvalentinmadiot%2Fimg-hover-effects_css","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvalentinmadiot%2Fimg-hover-effects_css","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvalentinmadiot%2Fimg-hover-effects_css/lists"}