CSS Stockを表示するスマートフォンのモック
デザインの例1デザインの例2デザインの例3

HTML・CSSでつくる影付きのめくれた付箋3選

メモや補足として使える「付箋ボックス」のデザインスニペットをまとめました。影をつけることで、より現実世界の付箋に近いデザインにしています。ちなみに用途こそ限られますが、かわいい系のサイトと特に親和性が高いのが特徴です。コピペだけで導入可能&色のカスタマイズも可能なので、ぜひ楽して他サイトと差別化を図ってみてください。

横長の付箋

単色

単色

  1. デザイン調整
  2. HTMLをコピペ
  3. CSSをコピペ
  4. 完了
step1

デザインを調整する

先端色あり

先端色あり

  1. デザイン調整
  2. HTMLをコピペ
  3. CSSをコピペ
  4. 完了
step1

デザインを調整する

正方形の付箋

単色

単色

  1. デザイン調整
  2. HTMLをコピペ
  3. CSSをコピペ
  4. 完了
step1

デザインを調整する