Chameleon.js

JavaScript

画像を元に自動でコンテンツに色付けしたりカラーコードを取得したりできる「Chameleon.js」

Chameleon.jsは、指定した画像を元に自動でコンテンツに色付けしたり、その画像からカラーコードを取得したりすることができるjQueryプラグインです。さまざまなパラメーターで色をソートすることもできます。

Chameleon.js

デモ

デモページにある「RUN QUICK DEMO」ボタンをクリックすると、コンテンツが表示されます。いくつかの丸い画像が用意されていて、いずれかをクリックするとその領域のコンテンツの色がその画像を元にした色に切り替わります。画像の下にはその画像に使われているカラーコードも表示されています。

画像を選択するだけで、一瞬でコンテンツがその画像のような色合いになるので、画像とコンテンツの色に統一感を出したい場合にはとても便利ですね。

また、画像からピンポイントでカラーコードを取得できるところもグッドです。画像に使われているカラーコードを知りたい時なんかにもよさそうですね。

下へスクロールしていくと、各機能による詳しい実装方法やデモが用意されています。画像を元にコンテンツの色を自動で決めるやり方やカラーコードを取得する方法、またはカラーをソートする場合など、いろんな機能があります。

カスタマイズも可能で、多様なセッティンができるので、気になる人はぜひチェックしてみてください。

というわけで、画像から自動でコンテンツに色付けしたりカラーコードを取得したりできる便利なjQueryプラグイン「Chameleon.js」のご紹介でした。

Chameleon.js

no-imageオーバーレイによるシンプルなアラートを実装できるjQueryプラグイン「simplert」前のページ

プログラムを入力するようにタイプするエフェクトを実装できる「Typed.js」次のページTyped.js

最近の記事

  1. 抹茶クリームドーナツ
  2. FAST
  3. クリスマスブレンド
  4. ホワイトチョコマカダミアドーナツ
  5. エッグペペ
PAGE TOP