Background designer
Det här är ett verktyg för att skapa färger och toningar som kan användas som bakgrunder. När man trycker på Background designer-ikonen öppnas ett nytt fönster där applikationen visas. Den förvalda toningen har två gråa färger och tonar linjärt uppifrån och ned mellan dessa nyanser. De färger och toningar man använder i Background designer representeras av en kod som genereras av de val man gör, och överst så visas den: linear-gradient(0deg, rgba(208,208,208,1) 0%, rgba(64,64,64,1) 100%).
När man drar i reglagen, lägger till och tar bort färger så ändras både toningen som visas och koden dynamiskt allteftersom de val man gör. När man är klar kan koden kopieras och klistras i en stilmall (CSS) för att användas. Backround designer är även integrerad i WebMans mallar utan att man behöver tänka på någon kod.
Hur funkar det?
Överst visas koden som genereras. Därunder ser man den faktiska toningen som motsvaras av koden. Både kod och färg ändras dynamiskt.
Typ av toning
Det finns två typer av toningar som kan användas:
- Linear
Linjär toning rakt över sidan i den vinkel som anges vid Angle. Shape och size har här ingen betydelse. - Radial
Elliptisk eller cirkulär toning enligt Shape och Size. Angle har här ingen betydelse.
När man valt typen Radial kan man klicka och dra på färgytan för att flytta toningens plats och storlek. Bredd och höjd är här godtycklig, men platsen för toningens centrum är angiven i procent i koden som genereras, så toningen fungerar i andra sammanhang på vilken yta som helst.
Färger som används
Man kan lägga till, ändra och ta bort färger. Varje rad under dragreglaget Angle är en färg som har 3 värden:
- Nyans
En färgväljare där man väljer färg. - Alpha
Grad av genomskinlighet. - Stop
Hur stor relativ del av bredden som är färgen i toningen, beroende av de andra färgerna som används.
Lägg till en ny färg genom att trycka på Add color och ta bort en färg med det röda krysset.
Exempel:
Repetera
Med Repeat återupprepas toningen flera gånger beroende av färgernas stop-värden. Här visas ett linjärt exempel och ett elliptiskt. Inställningen av stop-värdena är betydelsefull.