Patroongenerator
Maak naadloze SVG-achtergrondpatronen uit bijna 2.000 ontwerpen: pas kleuren, zoom, tussenruimte en hoek aan en kopieer de CSS of download SVG, PNG of WebP.
1Kies een patroon
Geen enkel patroon voldoet aan deze filters.
2Kies de kleuren
3Pas het patroon aan
4Animeer het (optioneel)
Het patroon verschuift per lus precies één tegel, zodat het nooit springt. De beweging blijft behouden in de code en het SVG-bestand; afbeeldingsbestanden blijven stilstaan.
5Kopiëren of downloaden
Uw kop komt hier
Bekijk hoe het patroon achter echte inhoud staat.
Aan de slagBladeren per collectie
Over Patroongenerator
De patroongenerator verandert bijna 2.000 kant-en-klare ontwerpen in achtergronden die u kunt afstemmen en meteen kunt gebruiken. Blader door 14 collecties, van golven, polkastippen en tessellaties tot tartans, Japanse seigaiha, islamitische sterren, Art Deco-waaiers, pixelsprites en camouflage, en zie elk ontwerp in uw eigen kleuren.
Elk ontwerp is getekend als vectorafbeelding en herhaalt zich zonder zichtbare naad, bij elke zoom en elke hoek. Wijzig maximaal zes kleuren, de zoom, positie, tussenruimte, lijndikte en hoek, verander gevulde vormen in omtrekken of laat het patroon bewegen met een lusanimatie. Generatieve patronen zoals topografische kaarten, Voronoi-cellen en Truchet-tegels kunnen bij elke klik een nieuwe variatie opleveren.
Ziet het er goed uit, kopieer het dan als CSS, SCSS, Tailwind-configuratie, inline SVG, data-URI of React-component, of download een SVG, PNG, JPG of WebP in elk formaat tot 8000 pixels, inclusief één enkele tegel voor uw eigen herhaling. Alles draait in uw browser: er wordt niets geüpload en er is geen account nodig.
Hoe gebruik je Patroongenerator
- Kies een patroon: zoek op naam of filter op collectie en aantal kleuren.
- Kies de kleuren met de kleurkiezers, een kant-en-klaar palet of “Nieuw palet”.
- Pas zoom, positie, tussenruimte, lijndikte en hoek aan. Vergrendel elke waarde die u bevalt voordat u op “Inspireer mij” drukt.
- Controleer het resultaat met de voorbeelden “Tegel tonen”, “Op een pagina” en “In tekst”.
- Kopieer de code of download het bestand en gebruik “Link kopiëren” om later naar precies dit patroon terug te keren.