Box Shadow

Web Service

CSSでボックスシャドウを作成してくれるジェネレーター「Box Shadow」

CSSでボックスシャドウを簡単に作成できるジェネレーター「Box Shadow」がとても便利だったのでメモがてらご紹介します。シャドウの位置やボカシの強弱などのバーを動かしながら自分にとって最適なボックスシャドウを作り込んでいくことができます。CSSコードもバーを動かす度にリアルタイムで切り替わっていくのがいいですね。

[ads_center]

Box Shadowの使い方

左側にあるバーを弄りながらボックスシャドウを調整していくことができます。使い方自体はとても簡単です。

Box Shadowの使い方

出来上がったら、右側にあるCopy Textというボタンをクリックすると、CSSのコードがコピーされます。

Box Shadowの使い方

とても手軽にCSSでボックスシャドウが作れるので、こういったジェネレーターを活用することで手間も省けて効率的ですね。

Box Shadow CSS Generator | CSSmatic

関連記事

  1. Web Service

    Google マップの地図の埋め込みをするやり方

    以前までGoogle マップの地図をサイト内に埋め込むには歯車アイコン…

  2. Web Service

    URLを入れるだけでレスポンシブなWebデザインを色々なデバイスで表示確認できる「The Respo…

    スマートフォンやタブレットなんかの色々なデバイスで表示確認することがで…

  3. Web Service

    Macでテキストをコピーした際にプレーンテキストにしてくれるアプリ「FormatMatch」

    Macでテキストなどをコピーしてエバノートなんかに貼り付けると余計な装…

  4. flatuicolorpicker

    Web Service

    フラットデザインの色の見本(RGB、HEX)が豊富にある「flatuicolorpicker」

    フラットデザインを取り入れる上で難しいのが色の選択。実際にどのような色…

  5. Web Service

    ブログで使う画像を加工・編集して文字入れや矢印も簡単に挿入できるSkitchの基本的な使い方

    毎回ブログで使う画像はPhotoshopで編集したりしてたんですが、も…

  6. Web Service

    背景パターンをお手軽に作成することができる「BgPatterns」

    背景パターンをとてもお手軽に作成することができるWebアプリ「BgPa…

最近の記事

  1. フェルメール展
  2. 上島珈琲店 No.11
  3. 銀座トリコロール

アーカイブ

PAGE TOP