記事は上記記事を意訳したものです。
※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。
Codepen や Github、その他の有用なリソースから集めた、無料の HTML と純粋な CSS のコード例をまとめました。このコレクションは、魅力的なぼかし効果をプロジェクトに取り入れたいウェブデザイナーや開発者のための包括的なガイドとして機能します。
CSS の力を使えば、ウェブデザインに深み、焦点、そして優雅さのタッチを簡単に追加できます。微妙で洗練された効果を目指すか、大胆で目を引く視覚効果を求めるかにかかわらず、これらのぼかし技術は間違いなくあなたのウェブサイトの美しさを高めるでしょう。
- A Draggable Popup with Backdrop Blur in HTML & CSS
- Quote Effect using a CSS Blur Filter
- Dynamic Background Image with CSS Blur Effect
- Smooth Blur
- Animated CSS Filter Blur
- Blurred Video Effect with CSS filter
- Shifting Depth of Field
- Pure CSS Motion Blur
- Blurred, Invisible Ink, and Redacted Text
- A Blurred Overlay
- In/Out of Focus Text Effect
- Text Blurring Animation
- Hover Effect Blur
- I LOVE BLUR
- Cross-Browser Image Blur With Transition
