utility-shadow

echo-shadow

要素に影をつける。
※この例では影を見やすくするため、意図的に .echo-button-style-(style) を付与していない。

<p><a href="#" class="echo-button echo-shadow">echo-shadow</a></p>

echo-shadow-none

影効果を解除する。

影効果の解除の例

echo-card には全体に影が加わりますが、 echo-shadow-none クラスを併用しているため、影効果が解除されています。

echo-shadow-(size)

影をつけた要素と背景の、擬似的な距離を変更する。

<p><a href="#" class="echo-button echo-shadow echo-shadow-sm">echo-shadow-sm</a></p>
<p><a href="#" class="echo-button echo-shadow echo-shadow-lg">echo-shadow-lg</a></p>