Skip to content
Pattern Craft

Pattern Craft

257 copy-paste CSS background patterns and gradients, MIT licensed

Tier A · StrongAsset PackGeneratorToolpatterncraft.fun

Preview image from patterncraft.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.

Install command, framework, licence and component list.

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

1

Helps you build

3

Notable 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
patterncraft.funTier A