handdator

Visa fullständig version : Grym CSS3 Gradient Generator


rhedman
2011-08-17, 12:26
http://www.colorzilla.com/gradient-editor/

Famous
2011-08-17, 12:33
Sweeet!

Hur många här har gott över till att göra gradients via kod istället för bilder? Beror visserligen på målgrupp och kund, men jag har bara gjort det på några få sidor hittills.

kalasboll
2011-08-17, 12:41
Jag har inte gjort det mer än på testsidor än. Oftast för texten i t.ex. en knapps skull som jag gärna kör på bilder då det, enligt mig i alla fall, ser bättre ut.

Adamhk
2011-08-17, 14:17
Jag har börjat att köra på det, men bara på mindre saker såsom knappar och sånt som man nog inte tänker på om man skulle sura in med ie8.

rhedman
2011-08-17, 14:54
Jag har börjat att köra på det, men bara på mindre saker såsom knappar och sånt som man nog inte tänker på om man skulle sura in med ie8.

Vi har börjat använda det lite smått. Din finns ju sätt att få det att funka ända bak till IE6 t.ex. http://css3pie.com/

kevva
2011-08-17, 16:35
Den var väl sådär. Jag brukar använda http://www.westciv.com/tools/gradients/ som har stöd för fler funktioner. Eller så skriver jag de rackarna själv.

Sweeet!

Hur många här har gott över till att göra gradients via kod istället för bilder? Beror visserligen på målgrupp och kund, men jag har bara gjort det på några få sidor hittills.
Jag har i princip använt det uteslutande under nästan ett år, med fallbacks för de webbläsare som inte kan läsa det riktigt givetvis. Brukar generellt sett alltid använda CSS3 då jag kan och sen köra fallbacks. Funkar fint.

rhedman
2011-08-17, 17:01
Den var väl sådär. Jag brukar använda http://www.westciv.com/tools/gradients/ som har stöd för fler funktioner.





Fast det känns som om den där hade stöd för betydligt färre funktioner? Bara 2 färger åt gången, ingen opacity, ingen möjlighet att ställa in storlek på boxen för preview, ingen kod för IE etc.?

Famous
2011-08-17, 17:03
Det verkar finnas massa funktioner, men betydligt jobbigare att använda. Eller så behöver man bara vänja sig :)

kevva
2011-08-17, 17:27
Fast det känns som om den där hade stöd för betydligt färre funktioner? Bara 2 färger åt gången, ingen opacity, ingen möjlighet att ställa in storlek på boxen för preview, ingen kod för IE etc.?
Nejdå, det finns stöd för flera färger (se "add stop"). Boxens storlek kan du ändra nere till höger genom att dra i den. MEN ok då, ingen opacity eller kod för IE. Det sög, även om jag brukar skriva dit alla vendor-prefixes själv ändå. Men den har stöd för radial gradients också i alla fall, där med stöd för IE.

Vi kan väl säga att de båda är goda komplement till varandra helt enkelt, så slipper vi bråka. ;ppPpPp hehehe.

rhedman
2011-08-17, 17:58
Kejrå :D

powerbuoy
2011-08-17, 18:41
Jag använder kod för gradients jämnt. Funkar väl i alla browsers? Tom IE5.5 tror jag.

kevva
2011-08-17, 18:45
Det gör det!
filter: progid:DXImageTransform.Microsoft.gradient(startColorSt r='#444444', EndColorStr='#999999');
Har man många stops är det betydligt enklare att använda en generator och sedan styra upp eventuella vendor prefixes själv. Det blir alldeles för pilligt om man skall sitta och skriva alla stops för hand.