ウェブデザインの配色設計に役立つオンラインサービスのまとめ -2013年春

見て楽しい触って便利な、最近リリースされたものを中心としたウェブデザインの配色設計に役立つオンラインサービスを紹介します。

まずは、気軽にカラーを楽しめるサービスから。

サイトのキャプチャ

Flat UI Colors

最近のフラットなデザインでよく見かけるカラーの一覧。

サイトのキャプチャ

PLTTS

COLOURloversの新しいカラーツール、今みんなが注目しているカラーがチェックできます。

サイトのキャプチャ

CSS Color Names

CSSで指定したカラーの名前の一覧。
サーモン、よく見かけます。

サイトのキャプチャ

Hexu.al

カラーコードを意味のある単語に置き換えたインスピレーションサイト。
ヘッダのストライプの仕掛け、面白いですね。

サイトのキャプチャ

Guideline Colours

ソーシャルサービス・ウェブサービスで使用されているカラーの一覧。

サイトのキャプチャ

BrandColors

有名なブランドのカラーの一覧。

サイトのキャプチャ

Web Colour Data

人気のあるウェブサイトで使用されているカラーの一覧。URLを入力して、指定ページのカラーを表示することもできます。

ここからは、カラースキームを設計できるサービスです。

サイトのキャプチャ

Colourco.de

カラーをセットし、セオリーに基づいたカラースキームを作成できます。

サイトのキャプチャ

Hex Color Tool

指定したカラーにホワイトとブラックを加えてカラーパレットを作成します。
こういったカラー展開はよくするので、重宝します。

サイトのキャプチャ

HEX to RGB Converter

HEX値からRGB値を、RGB値からHEX値をだします。

サイトのキャプチャ

Pretty IP

IPをRGB値に置き換えて、カラーを生成します。

サイトのキャプチャ

Multicolr Search Lab

指定したカラーをメインに写真をFlickrから検索します。

サイトのキャプチャ

Pictaculous

アップロードした画像からカラーパレットを作成します。

サイトのキャプチャ

iWantHue

洗練したカラーパレットをデータに基づいて作成できます。
アニメーションがあるので、適当にいじってるだけで楽しいです。

サイトのキャプチャ

Contrast Ratio

テキストと背景のカラーの組み合わせで視覚的にどのくらい読めるか数値化し、可読性を考慮した微妙なコントラストを設計できます。

top of page

©2017 coliss