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

WEBデザインのインスピレーションに!UIデザインのコードスニペットコレクション「CodeMyUI」

WEBデザインのインスピレーションになるUIデザインのコードスニペットがコレクションされた「CodeMyUI」をご紹介。
すっかりご無沙汰になってしまいました。
風邪がなかなか完治せず、夕方になると高熱がでてしまう悪循環が続いて、更新できずにおりました。
辛いですね、熱。
みなさまもくれぐれもご自愛ください。
さて「CodeMyUI」です。
個人の方が集めているUIで利用できるコードスニペットです。
興味深いUIばかりが集まっているのでとても参考になると思いますよ。

WEBデザインのインスピレーションになるUIデザインのコードスニペットがコレクションされた「CodeMyUI」

「CodeMyUI」は、WEBデザインのインスピレーションになるUIデザインのコードスニペットがコレクションされたサイトです。
個人の方がコレクションされているサイトなんですが、興味深いUIデザインのコードが数多く集まっています。
サイトにいけばすぐわかりますが、UIの様子がすべてアニメーションGIFになっています。
だから、英語表記だけど、どんなUIなのかがすぐにわかるという便利さ。
眺めているだけで、実装したいコードが出てきますよ。

「CodeMyUI」の使い方

使い方は特にありません。
カテゴリー分けされていませんし、検索ボックスがあるぐらいです。
ですので、ブラウジングして気に入ったものを見つけてください。
クリックすると以下のような詳細ページに飛びます。

WEBデザインのインスピレーションに!UIデザインのコードスニペットコレクション「CodeMyUI」

ご覧のとおり、コードはCodePenからの引用です。
メールアドレスを登録しておけば、更新のたびに知らせてくれますよ。
ぜひ参考にしてしてみてくださいね。

CodeMyUI.com

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

  • 0
  • 0
  • 0
  • 2

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

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

見ている人を魅了するcodrops作成のマウスオーバーエフェクト21

ユーザーを魅了するcodrops作成のマウスオーバーエフェクト21

CSS3対応のブラウザーが増えているおかげで、マウスオーバーエフェクトにも凝った演出を施しているサイ

記事を読む

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

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

記事を読む

100GB使える無料ストレージサービスshared.comにマルウエアが仕込まれてた

100GB使える無料ストレージサービスshared.comにマルウエアが仕込まれてた!?

各方面で紹介されている太っ腹な無料ストレージサービス「Shared」を利用し始めたところ、えらい目に

記事を読む

コピペで完了!12種類のプログレスバーを簡単に導入できるPACE.js

すでに当サイトにも導入してみたのですが、お気づきでしょうか。 PC版で当サイトをご覧いただくと、画

記事を読む

2014年登場のCSSツール・サービスはこれを!2014ベストCSSツール・サービス50

2014年登場のCSSツール・サービスはこれ!2014ベストCSSツール・サービス50

2014年に登場したCSS関係のツール、サービスをご紹介します。 CSS3の登場で、CSS関連のツ

記事を読む

写真/画像に3DCGポリゴン風エフェクトをかけてくれる無料/フリージェネレーター5つ

背景に使いたい!美しくカラフルなトライアングルメッシュ画像をSVGとして作成できるjsライブラリー「Trianglify」

最近よく見かける背景画像といえば、美しいボケ味の効いた画像やカラフルなピクセルパターンですが、美しく

記事を読む

CSSアニメーションでここまでできる!無料のCSSアニメーションコードサンプル

CSSアニメーションでここまでできる!無料のCSSアニメーションコードサンプル23

CSSアニメーションだけで、こんなこともできてしまうというコードサンプルをご紹介します。 掲載され

記事を読む

レスポンシブWEBデザインの確認に最適!スマホ・タブレットでの表示を一度に確認できる「Responsinator」

レスポンシブWEBデザインの確認に最適!スマホ・タブレットでの表示を一度に確認できる「Responsinator」

レスポンシブWEBデザインの確認に最適なツールをご紹介します。 このツールを使えば、スマホやタブレ

記事を読む

WEBサイトの必要な部分だけを印刷したいならコレが超便利!ブックマークレット「The Printliminator」

WEBサイトの必要な部分だけを印刷したいならコレが超便利!ブックマークレット「The Printliminator」

WEBサイトの必要な部分だけを印刷したい場合に大変便利なブックマークレットをご紹介。 このブックマ

記事を読む

アイコンはCSSで!フォントもSVGも使用しないCSSだけのアイコンセット「Icono」

アイコンはCSSで!フォントもSVGも使用しないCSSだけのアイコンセット「Icono」

CSSだけでつくられたアイコンセットのご紹介です。 近年のアイコンというと、アイコンフォントかSV

記事を読む