Våg-SVG-generator
Justera vågornas storlek, form och färg för att skapa avdelare eller bakgrunder för webbsidor. Kopiera eller spara SVG:en eller bakgrunds-CSS:en, eller spara en PNG-bild.
Vad du kan göra
Justera form och färger
Justera vågens höjd, antal, placering och fyllningsriktning och skapa den i en eller två färger.
Få resultatet i ett format som passar dina behov
Kopiera och spara SVG-koden eller en CSS-bakgrund, eller spara den som en PNG-bild.
Så använder du
Välj en utgångsform
Justera värdena direkt eller välj en liknande form under ”Välj en mall”.
Justera storlek och färger
Ange bredd, höjd, amplitud och antal vågor. Justera startposition och centrhöjd i avancerade inställningar.
Generera och kontrollera SVG:en
Kontrollera den genererade vågformen och de genomskinliga områdena. Generera om när du ändrar inställningarna.
Få det format du behöver
Välj SVG eller en CSS-bakgrund att kopiera eller spara, eller spara PNG:en.
Användbart för
Dela upp sidor i avsnitt
Skapa vågformade avdelare mellan innehållsavsnitt eller ovanför en sidfot.
Matcha din webbplats färger
Använd en enhetsfärg eller en gradient för att skapa en bakgrund som passar sidans färgschema.
Vågformer och sparformat
Amplitud och vågantal
Amplituden är den vertikala variationens storlek och vågantalet är antalet cykler över hela bredden. Det här är inte en funktion för att visa ljudvågformer.
Vågens placering och bortklippta områden
Ändra startpositionen med fas och den vertikala positionen med centrhöjd. Delar utanför bilden klipps bort.
Välja mellan SVG och PNG
SVG beskriver formen som vektorer. PNG sparar en bild med de angivna pixeldimensionerna och bevarar genomskinliga områden.
Hur du placerar en CSS-bakgrund
CSS anger en bakgrundsbild. Ange bredd och höjd på elementet där du använder den så att bakgrunden får en yta att visas på.
Vanliga frågor
Kan jag justera vågformens form och färgerna?
Du kan ange värden och färger. Välj ”Använd två färger” för att ange den andra färgen och gradientvinkeln.
Vad händer med de nuvarande inställningarna när jag väljer en mall?
Inställningarna, inklusive bredd, höjd och färger, ersätts av mallens inställningar. Justera de värden du behöver efter att du valt mallen.
Ändras förhandsvisningen när jag ändrar inställningarna?
När du har gjort ändringar väljer du ”Generera SVG” för att kontrollera resultatet. Det tidigare genererade resultatet går inte längre att visa eller spara.
Är SVG:en en exakt sinuskurva?
Vågen approximeras med en jämn kubisk kurva. Den är inte en vågform för matematisk mätning eller ljudanalys.
Filhantering
- Indata
- Skapa utifrån numeriska våginställningar och färger. Inget bildval behövs.
- Utdata
- wave.svg, wave.css och wave.png. SVG och CSS kan också kopieras.