KOMPOSE.
Toutes les ressources
Site Web

19 galeries pour voler les meilleurs designs du web

Le problème résolu

Tu ouvres Figma devant une page blanche, ou tu lances un prompt sans savoir à quoi tu veux arriver. Le problème n'est pas le manque d'idées, c'est le manque de références. Voici les 19 sites où nous allons chercher les nôtres.

Les galeries de sites finis

Onze galeries, et surtout onze niveaux d’exigence différents. Awwwards récompense la prouesse technique et publie tous les jours, ce qui en fait la plus riche mais aussi la plus bruyante. Godly ne retient que quelques sites par semaine et c’est précisément ce qui en fait la meilleure porte d’entrée quand tu as dix minutes. Land-book est le seul classé par industrie, donc le seul directement exploitable devant un client.

https://www.awwwards.com, https://godly.website, https://www.siteinspire.com, https://land-book.com, https://saaslandingpage.com, https://www.lapa.ninja, https://onepagelove.com, https://httpster.net, https://minimal.gallery, https://thefwa.com, https://www.cssdesignawards.com

  • onepagelove.com : Spécialisé sites une page. Parfait pour les petits budgets clients.
  • httpster.net : Sélection plus brute et plus typographique. Bon contrepoint à Awwwards.
  • minimal.gallery : Uniquement des sites épurés. Utile quand un client veut du sobre.
  • thefwa.com : Le plus expérimental. WebGL, 3D, projets de marques à gros budget.
  • cssdesignawards.com : Plus orienté exécution technique CSS que direction artistique.

Les patterns et les interfaces réelles

Ici on ne regarde plus des sites entiers mais des morceaux : une barre de navigation, un pied de page, un parcours d’inscription. C’est la ressource qu’on ouvre au moment de résoudre un problème précis, pas au moment de chercher une direction. 60fps.design est le plus sous-estimé du lot : chaque animation d’app y est filmée et classée par type de mouvement.

https://60fps.design, https://mobbin.com, https://refero.design, https://www.typewolf.com, https://www.footer.design, https://www.navbar.gallery, https://pageflows.com, https://fontsinuse.com

  • pageflows.com : Parcours utilisateurs filmés en entier : inscription, paiement, désabonnement.
  • fontsinuse.com : Archive de typographie appliquée, web et print, très documentée.

Comment s’en servir sans y passer la journée

Ces galeries sont un piège si tu les ouvres sans objectif : tu y perds une heure et tu ressors avec l’impression que tout est déjà fait. La méthode qui marche tient en une contrainte. Avant d’ouvrir quoi que ce soit, écris la question à laquelle tu cherches une réponse, du type comment ce type de marque traite son hero, ou comment on annonce trois offres sans faire un tableau. Tu t’arrêtes dès que tu as trois réponses. Trois références suffisent à nourrir une direction, la quatrième ne fait que retarder le moment de dessiner.

Ressources liées

Toutes les ressources
Site Web

21 outils pour finir ton site : typo, couleurs, performance

Un visiteur juge un site en moins d'une seconde, et à cet instant il n'a lu aucun texte. Il a vu une typographie, une palette et une vitesse de chargement. C'est la partie que presque personne ne travaille, et c'est exactement pour ça qu'elle rapporte. Voici les 21 outils que nous utilisons pour la traiter.

Voir la fiche
Site WebClaude

Comment sont construits les sites de Lando Norris, Charles Leclerc et Oscar Piastri

Les sites de pilotes F1 (landonorris.com, charlesleclerc.com, oscarpiastri.com) donnent l'impression d'un budget inatteignable, alors qu'aucun des trois n'utilise de 3D : tout repose sur Lenis, GSAP ScrollTrigger, des révélations de texte masquées et de la vidéo plein cadre. Le vrai blocage, c'est qu'un seul prompt ne peut pas produire ce type de site, parce que les systèmes dépendent les uns des autres (le moteur de scroll avant les animations, le préloader avant le hero, les épinglages dans une seule séquence). Ce guide détaille ce qui tourne réellement sous le capot des trois sites, puis découpe la construction en 10 étapes avec un prompt prêt à coller pour chacune.

›_Tu es mon partenaire de build pour un site one-page cinématique de pilote ou d'athlète, da
Voir la fiche
Site WebClaude

Reproduire une page produit Apple de A à Z (le démontage du code)

Les pages produit d'Apple passent pour hors de portée, alors qu'elles reposent sur cinq couches empilables et toutes reproductibles. Cette ressource ouvre les bundles JavaScript livrés en production sur iPhone 17 Pro, AirPods Pro et MacBook Pro, montre ce que chacune fait vraiment (shaders GLSL maison, scrub vidéo en HLS, moteur de keyframes piloté en CSS), puis donne l'ordre de construction et le prompt complet.

›_You are building an Apple-style product page: a long scroll where the visuals are driven b
Voir la fiche
Passer à l'action

On vous construit le site ?

Ces ressources donnent le ton. On peut livrer le site complet, rapide et pensé pour convertir.

Réserver un appelÀ propos de nous