個人的に役立ったデザイン素材やTips、WEBサービス、役立つグッズ、あれやこれやをご紹介

CSSボタンのコピペに!CSSでつくられたボタンのコードが100以上コレクションされている「CSS Buttons」

CSSボタンの参考になる!CSSでつくられたボタンが100以上コレクションされている「CSS Buttons」

CSSボタンの参考やコピペに使える、とても参考になるCSSボタンのコードがコレクションされているサイトをご紹介。
CSSでつくられたボタンのコードが100以上コレクションされている「CSS Buttons」です。
CSSボタンに実装されているアニメーションのデモも合わせて紹介されているため、使い勝手がとてもいいサイトになっています。
WEBデザインの参考にどうぞ。

CSSでつくられたボタンのコードが100以上コレクションされている「CSS Buttons」

「CSS Buttons」は、CSSでつくられたボタンのコードが100以上コレクションされているサイトです。
ソース元はすべてCodepenから。
ですから、ソースコードはそのままコピペして利用することが可能です。
CSSボタンに実装されているアニメーションも合わせて紹介されていますので、視認性にすぐれて、使い勝手のよいとても参考になるサイトです。
具体的には以下のようなボタンが紹介されています。

tumblr_inline_nt7vpgZH6H1tve1zn_500

tumblr_inline_nt272wQiGe1tve1zn_500

tumblr_inline_ntbggjtE8L1tve1zn_500

tumblr_inline_ntgbbl0e8B1tve1zn_500

WEBデザイン制作で参考になること間違いなし。
このサイトは必見です。

CSS Buttons

お役に立てましたら、以下どれでも結構のですので、ポチリと……。

  • 0
  • 0
  • 2
  • 6

Amazonアソシエイト・プログラム規約による記載
当サイトはamazon.co.jpを宣伝しリンクすることによってサイトが紹介料を獲得できる手段を提供することを目的に設定されたアフィリエイト宣伝プログラムである、Amazonアソシエイト・プログラムの参加者です。

この記事を読んだ人はこんな記事も読んでいます

UIデザインのリニューアル前と後を比較できるギャラリーサイト「Android UX before and after」

UIデザインのリニューアル前と後を比較できるギャラリーサイト「Android UX before and after」

UIデザインのリニューアルの前と後をひと目で比較できるギャラリーサイトをご紹介します。 Googl

記事を読む

レスポンシブ対応HTMLメールのフレームワーク集「Responsive HTML Email Framework」

レスポンシブ対応HTMLメールのフレームワーク集「Responsive HTML Email Framework」

レスポンシブ対応HTMLメールのフレームワーク集「Responsive HTML Email Fra

記事を読む

コード/js不要!ドラッグ&ドロップだけでCSSイメージスライダーがつくれるアプリ「cssSlider.com」

コード/js不要!ドラッグ&ドロップだけでCSSイメージスライダーがつくれるアプリ「cssSlider」

イメージスライダーは限られたスペースに多くの視覚的情報を盛り込めるので、ショップなどでは非常によく利

記事を読む

ブラウザがあればOK!コードを即実行・確認できるツール

ブラウザでプログラミング!ブラウザでコードが書けて実行・確認できるサービス14

ブラウザでコードが書けて実行・確認できるサービスをご紹介します。 サイトを実際に公開する前にテスト

記事を読む

CSSグラデーションを簡単につくれる「Colorful CSS Gradient Background Generator」

背景画像をサッとつくれる便利ツール20選

背景画像をサッとつくれる便利ツールやサイトをご紹介します。 背景にちょっと手を加えるだけで、見た目

記事を読む

今さら聞けない!作業時間を短縮するChrome用ショートカットベスト・コレクション

ブラウザはChromeを使ってます。 そのChromeでサイトを制作したり、ブログを書いたりしてい

記事を読む

いまさら聞けない無料のアイコンフォントの導入の仕方・使い方

アイコンフォントを今頃になってようやく使ってみました。 最初は正直よくわからず、戸惑ってしまいまし

記事を読む

JSを使わずにCSSだけで簡単にシンプルなパララックス効果をつける方法

JSを使わずにCSSだけで簡単にシンプルなパララックス効果をつけられる方法をご紹介します。 パララ

記事を読む

人気のHTML/CSSコードサンプル25+おまけ2 from CodePen

CodePenはHTML,CSS,JSのコードサンプル配布サイトです。 紹介されているコードの種類

記事を読む

アイコンフォントはもはや常識!アイコンフォントを無料で利用できるサービス ベスト10

アイコンフォントはもはや常識!アイコンフォントを無料で利用できるサービス ベスト10

好きなアイコンだけを選んでオリジナルのアイコンフォントにできる無料のサービスをまとめてご紹介します。

記事を読む