Portfolio avec galerie filtrable, animations au scroll et effets hover.
Le gradient sur le mot-cle du metier cree une signature visuelle forte. L'oeil est immediatement attire vers l'identite du designer, renforce par les stats en degrade.
background-clip: text + -webkit-text-fill-color: transparent Explorer Texte & Typo →La ligne se dessine progressivement sous le lien au survol. Un feedback visuel minimaliste qui s'accorde avec l'esthetique epuree d'un portfolio creatif.
::after width: 0 to 100% + transition: 0.3s Explorer Hover & Interactions →L'overlay sombre avec le bouton "View Project" apparait progressivement. L'utilisateur comprend que chaque carte est cliquable sans encombrer la vue galerie.
opacity: 0 to 1 + translateY(20px) to 0 Explorer Hover & Interactions →Le bouton actif change instantanement de couleur et les projets non-filtres disparaissent. Le tri immediat evite le rechargement et garde l'utilisateur engage.
display: none/block + background transition 0.3s Explorer Transitions →Chaque barre se remplit avec un scaleX anime au chargement. Plus impactant qu'un pourcentage textuel — le visiteur percoit le niveau de competence d'un coup d'oeil.
animation: skillFill 1s ease forwards + scaleX(0 to 1) Explorer Data & Visualisation →Les elements montent de 40px et deviennent visibles au scroll via IntersectionObserver. Cela cree un storytelling visuel ou chaque section se "revele" progressivement.
opacity: 0 + translateY(40px) + .visible class Explorer Scroll & Parallax →Le champ s'illumine avec un halo violet au focus. Ce feedback visuel guide l'utilisateur dans le formulaire et rend l'experience de saisie plus agreable.
border-color: var(--primary) + box-shadow: 0 0 0 3px Explorer Formulaires →