CSS チェックボックス デザインテンプレート 4選

フォームに使われているラジボタオンのCSSのデザインサンプルです。

特徴

  • レスポンシブ対応
  • 色変更可

ベーシックなデザイン

See the Pen
checkbox css 1
by kura (@kuranopen)
on CodePen.

シンプルな使いやすいチェックボックス。

角丸

See the Pen
checkbox css 1
by kura (@kuranopen)
on CodePen.

枠線が角丸のチェックボックス。

モノクロ

See the Pen
checkbox css 1
by kura (@kuranopen)
on CodePen.

白と黒のモノクロのチェックボックス。

絵文字っぽい

See the Pen
checkbox css 1
by kura (@kuranopen)
on CodePen.

絵文字☑に似せたチェックボックス。

デザイナーのUIメモ帳

レイアウト

ヒーローエリア

フォーム

画像

テキスト

ナビゲーション

コンテンツ

CSSデザインサンプル

モバイルサイト

Javascript

Google Map

Youtube

  • このエントリーをはてなブックマークに追加

プロフィール

kura

WEBで食べていきたいWEBデザイナーです。
WEBデザイン初心者向けになるべく分かりやすいように解説しています。 そのほか、WEBデザインの便利ツール紹介、開発したりしています。