モダンCSSで実装された、UIデザイン用の美しいグラデーションとジオメトリックの背景パターン -Pattern Craft

Webサイトやスマホアプリに最適、モダンCSSとTailwind CSSで作成されたプロ仕様の背景パターンとグラデーションを紹介します。

100種類以上の背景パターンとグラデーションはシームレスに設計されているので、あらゆるサイズで利用できます。

UIデザイン用の美しいグラデーションとジオメトリックの背景パターン -Pattern Craft

Pattern Craft
Pattern Craft -GitHub

Pattern Craftは優れたデザインを重視するデベロッパー向けに、100種類以上の背景パターンとグラデーションをまとめたサイトです。背景パターンとグラデーションはモダンCSSとTailwind CSSなので、コピペで簡単に利用できます。

MITライセンスで、個人でも商用プロジェクトでも無料で利用できます。

サイトのキャプチャ

Pattern Library -Pattern Craft

これらの背景パターンとグラデーションのコードは、React, Next.js, Vue, Angularなどのフレームワークを使用するデベロッパーやデザイナーに最適です。

サイトのキャプチャ

Gradient -Pattern Craft

背景パターンとグラデーションは、5つのカテゴリに分けられています。

  • Gradients
  • Geometric
  • Decorative
  • Effects
  • Favourites

Geometricには、幾何学模様のパターンが揃っています。

サイトのキャプチャ

Geometric -Pattern Craft

白地のGeometricもさまざまなパターンが揃っています。

サイトのキャプチャ

Geometric -Pattern Craft

Decorativeは最近見かける、繊細なグラデーションです。

サイトのキャプチャ

Decorative -Pattern Craft

Effectsにはオーロラのような美しいグラデーションが揃っています。

サイトのキャプチャ

Effects -Pattern Craft

それぞれの「Preview」をクリックすると、その背景パターンとグラデーションがページ全体に適用されます。

サイトのキャプチャ

Decorative -Pattern Craft

Decorativeの左上のグラデーションで「Preview」をクリックすると、そのグラデーションが適用されます。

sponsors

top of page

©2025 coliss