Webやアプリのデザイントレンドを紹介。たまに雑談。

Browse By

Tag Archives: ColorPalette

[Color] Color Supply – 色相環を使ったカラーパレットのシミュレーター

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

色選びのお供、色相環を使ったカラーパレットのシミュレーターです。この手のツールによくある、カラースキームを選んでパレット生成するという機能に加え、イラストやテクスチャを使った簡単な作例生成まで行える点が特徴です。まずは用意されている5つのカラースキームから好きなものを選びましょう。Complementaryは対面にある色(補色色相)、Analogousは隣り合う色(類似色相)、Triadは正三角形、Split-Complementは二等辺三角形(分裂補色)、Squareは四角形の配色となります。次に色相環の中から基調とする色を選択します。するとカラースキームに沿ったカラーパレットが生成され、色相環の下にはイラストとテクスチャで作例を表示してくれます。またカラーコードの生成や、グラデーションを使った例も作ってくれます。選んだ色を使ってどんな雰囲気になるのかすぐに確認できる点がとってもナイスです。

[Color Palette] random a11y – アクセシビリティーに配慮したカラーパレットを生成してくれるサイト

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

Webアクセシビリティーに配慮したカラーパレットを生成してくれて、さらに投票もできるサイト。一定のコントラストが確保された、背景色と文字色を出力してくれます。あとパレット生成の度にCSSコードも吐き出してくれます。よくあるカラーパレットオススメツールではあるんだけど、出て来る配色がイイ感じのものが多かったのが個人的にグっときました。ちなみに「a11y」ってなんのこっちゃ、って最初思ったんですが、この言葉って「accessibility」の略語なんですね。「単語なげーから途中の11文字略したわ!」的な流れで出来たそうで。こういう乱暴な略し方嫌いじゃないです。

[Color] LOL Colors – カラーパレットギャラリー

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

クールなカラーパレットをギャラリー形式で紹介するサイト。色にマウスオーバーするとHEX指定での値が出ます。紹介されている数はそれほど多くないけど、多分今後増えるんでしょう。配色決める際のネタ探しに使えそうです。

[Color] Palettable – 好きか嫌いかで1色ずつ色を決めていくカラーパレット

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

好きか嫌いかという極めてシンプルな基準で、1色ずつ色を決めていくカラーパレット生成サイト。気に入ったらLikeの「L」を、気に入らなかったらDislikeの「D」をタイプするだけ。Likeされた色はカラーパレットに残りますが、やっぱコレいらねーやと思ったら「Backspace」キーで削除する事もできます。また作ったカラーパレットはこんな感じに固有のURLが生成されるので、他人と共有するのもラクチンです。サイトとかアプリのカラー指定する際に、「こんな感じどうかなー?」みたいにチームで議論する時なんかに使えそうです。

[Color Palette] brand-colors – Webブランドカラーの一覧サイト

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

様々なWebブランドのキーカラーを一覧にしたサイト。任意のカラーにマウスオーバーするとサイトの背景色がその色になり、クリックするとカラーコードがクリップボードにコピーされます。またカラーパレットの左上には検索窓があり、ブランド名などで検索する事もできます。紹介されているWebブランドがかなり多いので資料的価値もありそう。ブランドカラーやコーポレートカラーを模索する時の参考になりそうです。

[Color Palette] ColorFavs – 画像からカラーパレットを生成してくれるサイト

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

写真などの画像ファイルからカラーパレットを生成してくれるサイト。使い方は簡単で、サイト内の点線エリア内に画像ファイルを放り込むだけ。少しだけ待たされた後、パレットを生成してくれます。パレットの色数なんかは全部自動のようです。Webサイトのスクリーンショット放り込んでパレット抽出したりするのにイイですねこれ。

[Misc] Pokemon Palettes – ポケモンのモンスターのカラーパレット

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

ポケモンに出てくるモンスターのカラーパレット。キーボードの十字キーやスペースキーを押す事で、1つ1つ閲覧していく事ができます。おおよそ何の仕事の役にもたたず、その上ポケモン好きな人がこのブログを読むとも思えないんですが、なんとなくドット絵がアツかったので紹介。ちなみにわたくしポケモンて1秒もやった事がなく、何のゲームなのかさえ実はよく分かりません。

[Logo Design] Brandseen – 有名ブランドロゴの色当てクイズ

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

コカ・コーラやマクドなど、誰でも知っている有名ブランドのロゴの色を当てるクイズ。まぁコーラは簡単ですわ。けどYahooはYahoo Japanのイメージが強すぎて間違えちゃいました。日本のフランチャイズ版ではなく、本家の方のロゴを思い出しましょう(新ロゴだったら分かったのにな・・・)。あと大好きなAppleでなぜか間違えてしまいションボリ。トータル66%のスコアでした。結構低いな・・・。原色ハッキリのロゴは比較的当てやすいけど、中途半端な色を使ってるロゴの場合結構難しいです。人間の記憶なんて結構ボンヤリですからねぇ。