pattern.css
pattern.cssはCSSだけで作れる様々な背景パターンを手軽に作れるスタイルシートです
ドットや縦線、横線、斜めなどのストライプ、ジグザグなどを作成可能で、色やサイズも手軽に変更できるようになっています
以下、動作サンプルです
動作サンプル
テキスト、画像など、様々な要素にclass付与だけで利用できるよう設計されています
サンプルでは以前ご紹介したshorthand frameworkを併用しています
<link href="https://unpkg.com/pattern.css" rel="stylesheet"> |
CSSを読み込みます
<div class="pattern-checks-sm bg-blue red"> <h3 class="pattern-grid-sm bg-mint white text-pattern fw-800 fs-xl3 md-fs-xl4 lh-1 text-center"> kachibito </h3></div> |
背景を設定したい要素にclassを付与します。簡単ですね。ライセンスはMITとの事です
