Pick colors from images or choose from palette.
Optical Illusion Generator
Explore six optical illusion patterns with adjustable colors, including a Hermann grid, Café Wall, concentric circles and animated spirals.
Free · No signup
Checkerboard Illusion
The gray dots create a shimmering effect at the intersections.
How Optical Illusions Work
- • Our brain makes assumptions to process visual information quickly
- • Contrast and patterns can trick the visual cortex
- • Motion illusions exploit how our eyes track movement
- • These illusions reveal how perception differs from reality
How do I make an optical illusion pattern?
Choose one of six patterns and change its two colors to compare the effect. Spiral and Motion patterns also have an animation-speed control; the other patterns are static.
- Select Checkerboard, Rotating Spiral, Hermann Grid, Café Wall, Motion or Concentric Circles.
- Adjust the two colors and observe how the contrast changes the pattern.
- For Spiral or Motion, adjust the animation duration in seconds.
Worked example
Pattern: Café Wall Color 1: black Color 2: white
Offset rows of contrasting blocks with horizontal gray lines. Compare the apparent line directions while changing the colors.
Supported behavior and limitations
This page displays SVG patterns in the browser and currently has no image-download or print preset. Spiral and Motion use real animation, so their movement is not solely a static visual illusion. Appearance varies with screen size, contrast and the viewer.
Is the rotating spiral actually moving?
Yes. The spiral uses a CSS rotation animation. Its speed control sets the duration of a rotation in seconds.
Which patterns can I compare without animation?
Checkerboard, Hermann Grid, Café Wall and Concentric Circles are static. Use them to compare color and contrast without the animated patterns.
Tool processing and website analytics are separate. See the privacy notice for usage requests, network features and analytics data flows.
Related tools
Useful next steps for this task
Convert colors between HEX, RGB, HSL, and more.
Generate color palettes from images.
Check WCAG contrast ratios for opaque text and background colours.
Resize images to specific dimensions.
Convert images between PNG, JPG, WebP, and more.