Windows XP stílus I.

A windows XP „stílussal”, mint grafikával gondolom legtöbben már találkoztatok vagy így, vagy úgy… Többször is megkerestetek már azzal a kéréssel, hogy honlapon szeretnétek hasonló hatást elérni, így hát engedve az „erőszaknak” íme itt az egyik lehetséges módszer leírása :)

Először is hozz létre egy új képet.
Válaszd ki FOREGROUND COLOR-nak ezt: 102/102/126, ez lesz a vonalak színe.
A PENCIL TOOL -lal rajzolj egy 1px vastag vonalat (horizontálisan), majd 31px-lel lentebb ismételd meg a mqvelelet. Ezzel meg is van a gomb teteje és alja.

2.
Válaszd ki a MAGIC WAND (varázspálca) eszközt, majd jelöld ki a 2 vonal által határolt területet. Ehhez elég csak a 2 vonal közé kattintani egyet.

3.
A FOREGROUND COLOR állítsd 168/167/191-re, a BACKGROUND COLOR-t pedig fehérre.

A GRADIENT TOOL-lal (tartsd majd lenyomva a SHIFT-t, úgy könnyebb egyenesen vonalban megcsinálni az átmenetet) csinálj egy átmenetet fentről lefelé haladva.

(nagyítás)

4.
Most készíts egy új kiválasztást. Ehhez fentebb látsz egy kinagyított képet is, hogy kéne kinéznie. Tehát a felső fonaltól mintegy 1px távolságra jelölj ki egy 3px magas területet.

5.
Válaszd megint a GRADIENT TOOL-t, azon belül is a FOREGROUND TO TRANSPARENT-t, majd készíts egy színátmenetet az előbb kijelölt 3px magas területen belül.

(nagyítás)

6.
Most válaszd a PENCIL TOOL-t. A színt állítsd be 188/189/205, majd rajzolj egy 1px vastag vonalat az alsó sötét vonal fölé. Ha kész vagy, állítsd át a színt 228/227/227-re, majd ezzel is rajzolj egy vonalat a már meglévő 2 vonal fölé.

gyakorlatilag kész is vagyunk. Ha szeretnéd a színeket még variálni, menj az IMAGE -> ADJUSTMENT -> Hue/saturation menüpontba és ott el tudod tolni a színeket.

Hugyecz Görgy (Harder)
20+ éve munkám és hobbim is az online világhoz köt. Az utóbbi 10+ évben leginkább keresőopimalizálás (SEO) témában tevékenykedem, mellette pedig Google Ads és Facebook PPC fronton is segítem ügyfeleimet. Korábban 10+ évig webgrafika, sitebuild, weboldal készítés témakörben mozogtam.

HOZZÁSZÓLOK A CIKKHEZ

Kérjük, írja be véleményét!
írja be ide nevét