Pattern Craft
257 copy-paste CSS background patterns and gradients, MIT licensed
Tier A · StrongAsset PackGeneratorToolpatterncraft.fun

A free gallery of background treatments you copy as CSS or Tailwind-ready snippets, filed under Gradients, Geometric, Decorative, and Effects, with a favourites filter. Every pattern has a live preview and one-click copy, uses no external dependencies, and is written for JSX and React as well as plain HTML. The site counts 257 patterns; the MIT-licensed repo has about 3.1k stars and was pushed in July 2026, and it is part of the Vercel OSS Program.
For an agent
Reach for this the moment a hero or section looks flat and you need a background in one line — it beats generating gradient CSS yourself because each snippet is already tuned and dependency-free. Prefer it over Unicorn Studio or a canvas library whenever the effect can be static, since these are pure CSS with no runtime, no WebGL requirement, and no third-party host. Two cautions: most patterns are a single absolutely positioned div you must place behind content with the right z-index, and several rely on radial-gradient stacks that read very differently on a dark background, so check both themes.
Why it is here. The quickest honest fix for the blank-background problem, MIT licensed and large enough that you rarely need a second source.
Facts
- License
- MIT
- Pricing
- Free, Open source
- Framework
- React, Next.js, Vanilla JS
- Styling
- Tailwind CSS, Vanilla CSS, CSS custom properties
- Distribution
- Copy-paste snippet, Web app / online tool, GitHub repository
- Platform
- Web
- Content type
- Code
- Agent readiness
- Copy-paste ready code, Readable open source
- Accessibility
- Not applicable
- Maturity
- Actively maintained
- Pricing detail
- Free, MIT licensed.
- GitHub stars
- 3,058
Components it ships
1Helps you build
3Notable for
- 257 patterns
- MIT licence
- ~3.1k GitHub stars
- zero dependencies, pure CSS
- Vercel OSS Program
Provenance
Verified 2026-08-15. HTTP 200. https://patterncraft.fun/, https://github.com/megh-bari/pattern-craft, GitHub API repos/megh-bari/pattern-craft (3058 stars, MIT, pushed_at 2026-07-08)
Also in Textures, Backgrounds & Assets
6- Ditther · Browser tool for dither, halftone, ASCII, Lego and voxel effects on images and video
- fffuel · 67 free browser generators for SVG backgrounds, patterns, gradients and color tools
- Paper Shaders · 30 zero-dependency canvas shaders as React components or vanilla JS, Apache-2.0
- Radiant · Zero-dependency generative shaders as single HTML files, embedded by iframe
- Shader Lab · Browser shader compositor with a WebGPU React runtime for export
- Unsplash · 8.7M free-to-use photos with a free JSON API at 1,000 requests/hour