Reshader

JavaScript

カラーの濃淡を得ることができるJavaScriptライブラリ「Reshader」

Reshaderは、カラーの濃淡を得ることができる便利なJavaScriptライブラリです。指定した任意のカラー値を基準にして、そのカラーより薄い色から濃い色までのカラー値を取得することが可能です。オプションも用意されているので、カスタマイズ性も高いライブラリに仕上がっています。

Reshader

デモ

Usageという項目がある場所に、カラーコード(hex)を入力するボックスが用意されています。デモページ読み込み時には「#6EEB83」という値が指定されていて、その下には指定したカラーコードを基準にして作られた濃淡の異なるカラーとカラーコードのリストが表示されています。

ボックス内に好きなカラーコードを入力すると、リアルタイムで反映されます。特定の色を元に濃淡の異なるカラーコードを取得したい場合にはとても役立つ機能ですね。

また、APIではcolorとoptionsのセッティングができるようになっています。colorには先ほどのhexのほか、rgbやhslでの指定も可能です。

optionsには、numberOfVariations、contrastRatio、outputModel、shouldIgnoreRepeated、shouldIgnoreWhites、shouldIgnoreBlacksといった項目があります。

多彩なカスタマイズを施せるのも、このJSライブラリの魅力になっています。

Reshader

関連記事

  1. characterCounter

    JavaScript

    文字数のカウントや制限ができるjQueryプラグイン「characterCounter」

    characterCounterは文字数をカウントしてくれるシンプルな…

  2. JavaScript

    シンプルで使いやすいベーシックなスライドショーを実装できるjQueryプラグイン「Basic jQu…

    jQueryスライダーのネタが多いですが、今日もまたスライダーのプラグ…

  3. Accessible Mega Menu
  4. nanogallery2

    JavaScript

    美しくてハイクオリティなイメージギャラリーを実装できる「nanogallery2」

    nanogallery2はパーソナルニーズにピッタリなイメージギャラリ…

  5. Wipe Slider

    JavaScript

    背景画像を滑らかにスライドさせるjQueryプラグイン「Wipe Slider」

    Wipe Sliderは背景画像を滑らかにスライドさせることができるj…

最近の記事

  1. Olli
  2. 単語帳メーカー(Flashcard Maker App)
  3. 1Password 7
  4. 風に揺れる草

Facebookページ

PAGE TOP