決済・EC

用途

選択UI2026-09-119種

セグメントコントロールUI 9選 — コピペOK

セグメントコントロールとは、iOSの設定画面でよく見る、いくつかの選択肢から一つを選ぶと背景のピルがその位置までスライドするタブ切り替えボタンです。セグメントコントロールから絵文字リアクション・カラースウォッチまで、名前は知らなくてもアプリ

読む

CSS ホログラムとは、角度によって光の反射が変わる箔素材を、CSSのグラデーションとアニメーションだけで再現する技法です。ポケモンカードのような輝きは何度も画面で見かけますが、いざコードにしようとすると手が止まることが多いので、カード・ス

カードフリップアニメーションとは、マウスを乗せたりクリックしたりするとカードがくるっと回転したり半分に折れたりして、裏側の内容が現れる効果のことです。コードが分からなくても、下のデモにマウスを乗せてみれば何が起きているか一目で分かります

css スケルトンとは、本物のコンテンツが届く前に画面の形だけを灰色の板で先に見せておくローディング表現のことです。この記事ではシマーライン・カード・表・コンテナクエリまで9種類を選び、JavaScript を使わず SCSS だけで実装し

css モーダルは、ボタンを押した瞬間に画面の上に浮かぶ確認・選択用の小さなパネルのことで、CSS だけで開閉のアニメーションまで作れます。この記事では9種類を選び、下のグリッドは2秒ごとに自動で開閉するので、クリックはできず眺めるだけにな

ボタン2026-09-099種

CSS ボタンアニメーションは、ボタンが操作に「反応した」ことを伝える小さな動きです。ホバー、押下、待機、失敗、確定。この記事ではこうした状況を9つ選び、それぞれ transform と opacity だけで実装しました。グリッドで触っ