Boutons style Web 2.0
Un petit tuto pour expliquer comment j’ai fait le bouton qui me sert de bannière dans le titre de mon blog.
Ce bouton est réalisé avec le logiciel The Gimp.
Voilà comment faire ça:
Tout d’abord, on ouvre un nouveau document de taille variable (ici 370×50) avec un fond transparent:
pour les bords ronds (coucou Meric!): Sélection > Rectangle arrondi> Rayon 70% > remplir de noir
La fine bordure noire sera créée en réduisant la sélection de 1 ou 2 pixel (Sélection > Réduire)
Dans cette nouvelle sélection ainsi faite, on utilisera les couleur noire en arrière plan (000000) et grise en premier plan (2d2d2d) Note: pas de # pour les couleurs dans The Gimp
On appliquera ensuite, dans la boîte à outils, l’outil dégradé “PP vers AP” afin de remplir cette sélection:
Effet optique du dessus: Créer une petite sélection rectangulaire:
On appliquera l’outil dégradé PP vers transparent en ayant choisi le blanc (FFFFFF) comme couleur de premier plan:
Effet optique du bas:
le principe est le même, mais cette fois, on utilisera un calque: Calque > Nouveau et on fera une sélection rectangulaire assez fine sur le bas du bouton qui sera remplie en blanc
Ensuite: Sélection > Aggrandir (1px) et Filtre> Flou > Flou gaussien. Il ne reste plus qu’à règler l’opacité du calque dans la fenêtre correspondante (de 40% ici) et c’est fini:
Bien entendu, les différents règlages de pourcentages sont ici donnés à titre indicatif et toutes les autres couleurs peuvent être employées…
etc… Bon amusement!
13 avril 2008 à 12:15
Bonjour,
Et grand merci à Phil… de la part d’un handicapé de l’arrondi