【定番】UIデザインで効果的なドロップシャドウ、影の付け方５選文字や画像に、まるで影が落ちているような立体感を表現できる、「ドロップシャドウ（英： Drop Shadow）」。 美しい影をデザインするテクニックや、コピペ可能なCSS便利コレクションや色付きの影生成ツールなど、さまざまな「影」を紹介してきました。 今回は、最近のWebサイトで効果的なドロップシャドウ5つのスタイルの作成方法、使いかたを詳しくみていきましょう。 1. 基本のドロップシャドウ 2. ハードシャドウ・スタイル 3. ハイコントラスト・シャドウ 4. ローコントラスト・シャドウ 5. カラーシャドウ まずは、基本のドロップシャドウ ウェブサイトでもよく見かける、一般的な以下のカード型UIデザインを参考に、さまざまなドロップシャドウを追加していきます。 ここでは、無料ダウンロードできるFigma用UIキットを利用。画像イメージや見出しも便利なプラグインで自動、一発で挿入してくれま
