🪟

Glassmorphism CSS Generator で簡単にすりガラス効果のあるCSSを作る

2021/04/19に公開

Glassmorphism CSS Generator とは?

ここ

使用感

こんな感じにすりガラス効果のあるCSSを作れる
<p class="codepen" data-height="500" data-theme-id="dark" data-default-tab="css,result" data-user="noouchi" data-slug-hash="WNoQGda" style="height: 265px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;" data-pen-title="Glassmorphism Sample">
<span>See the Pen <a href="https://codepen.io/noouchi/pen/WNoQGda">
Glassmorphism Sample</a> by noouchi (<a href="https://codepen.io/noouchi">@noouchi</a>)
on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://cpwebassets.codepen.io/assets/embed/ei.js"></script>

作り方

Glassmorphism CSS Generatorにアクセスするとおもむろに弄れそうな項目があるのでいじいじする

スクリーンショット 2021-02-03 21.40.10.png


スクリーンショット 2021-02-03 21.42.09.png

CSSも同期して生成されるのでよしなに使おう🎉

GitHubで編集を提案

Discussion