ToolZool
CLR / 04 · 色ツール

box-shadow生成

オフセット、ぼかし、広がり、色を、実際のカード上で見ながら調整します。

ボックスシャドウ生成ツール
本物のカードに、重ね⁨2⁩枚
カード

このカードの下にある影は、上の宣言をこの要素に当てたものです。それらしく描いて見せているわけではありません。

CSS
box-shadow: 0 10px 30px -6px rgb(0 0 0 / 45%), 0 4px 6px -4px rgb(0 0 0 / 30%);

色は16進数の3桁か6桁で指定し、不透明度は別のスライダーで決めます。長さの単位はピクセルで、広がりが0のときは何も言っていないのと同じなので省きます。

支援する 💚ToolZool を無料に保つ手助けを

みなさんのおかげで、
ToolZoolは無料のまま

優れたツールは、誰にとっても無料であるべきです。その費用をどう賄っているのか、隠さず全部書きます。

Zoolyにコーヒーをおごる灯りをともし、新しいツールを生み出すための直接の支援。まったくの任意です。Zoolyを支援する →
おすすめの品ブラウザでは終わらない仕事を片づける有料ツール。あのページから、いまこちらが得るものはありません。おすすめを見る →
礼儀をわきまえた広告広告と明示した枠は作業領域の外に置くので、操作と結果のあいだに割り込むことはありません。広告方針を読む →
あなたは最高です訪問も、共有も、温かいひと言も、ToolZoolが育って多くの人に届く助けになります。