Pattern Generator
Pattern maker for two-color stripes, polka dots, checks, grids, zigzags, waves and rings. Set the angle, let it scroll, and save a PNG or MP4 for free.
What is a pattern maker?
A pattern maker draws a design that repeats across a surface. This one gives you seven geometric repeats in two colors: stripes, dots, a checkerboard, a grid, zigzags, wavy lines and concentric rings. They're the classic patterns of textiles and print, all the way from candy stripes to the polka dot (an even array of circles, all the same size).
Each shape comes from a signed distance function, meaning the distance to its edge, and not from a tile image, so the edges stay smooth at any size or angle. Every pattern is anchored on the center of the frame, and Angle rotates it around that point.
How to make a pattern background
Pick a Pattern or start from a preset: Candy stripes, Polka, Checker, Blueprint grid, Zigzag or Rings. Size is one repeat, in pixels of a 1080p frame. Thickness is how much of each repeat the foreground covers, from hairlines up to nearly solid, though the checkerboard ignores it and keeps its squares even.
Angle rotates the pattern anywhere from 0 to 180 degrees. Scroll slides it along its own direction at that many repeats a second, and a negative value runs it backward. The two inks are Foreground and Background, both under Colours.
There are also three single-pattern pages that open straight onto one repeat: Polka Dot Pattern Maker for dots, Checkerboard Pattern Generator for checks and Stripe Pattern Generator for stripes.
Settings for a blueprint grid, a chevron and op-art rings
Blueprint grid: the Blueprint grid preset draws pale #cfe3ff lines on #1b4e9b at Size 80 and Thickness 0.08, which works out to about 3 pixels per line. For a finer drafting grid, cut Size in half to 40 and bump Thickness up to 0.1, giving lines 2 pixels wide.
Chevron: with Pattern on Zigzag at Angle 0, the zigzags run across the frame in level rows. Thickness 1.5 turns them into broad bands with narrow gaps. Use the Zigzag preset's #f4a261 on #264653 and you've got orange on deep teal.
Op-art rings: Pattern Rings in black and white, Thickness 1, Scroll 0. As long as Scroll stays at 0, the rings are centered on the middle of the frame. Give it any other value and that center slides sideways, so the rings look like they're pouring out of one side.
How do I make a pattern that tiles seamlessly?
Begin on the blank canvas. It's 1920 by 1080 pixels, so Size is measured in real pixels there. Set Angle to 0 and choose a Size that divides evenly into both 1920 and 1080, like 120, 60, 40, 30 or 24. Then the saved PNG finishes on the same part of the repeat it began on, and copies placed side by side meet with no seam.
Any angle other than 0, 90 and 180 breaks this, because the repeat stops lining up with the edges of the frame. Rings won't tile at all, since they only have one center.
Saving a two-color pattern as a loop or a still
Because Scroll is counted in repeats, loops are easy. The frame looks identical after one repeat, so a clip of 1 ÷ Scroll seconds (or any multiple of that) loops without a jump. Scroll 0.25 lines up with itself every 4 seconds, and 0.5 every 2.
These patterns are a good fit for GIF. Two inks plus their soft edges add up to far fewer than its 256 colors, and if you untick Dither the edges stay clean. For a still, a PNG keeps every edge exact in a small file. JPG would blur the boundary between two saturated inks.