タグ

配色に関するteracy_junkのブックマーク (15)

  • マンセル表色系の色見本 - color-sample.com

    Munsell マンセル表色系とは、アメリカの画家・兼美術講師の アルパート・H・マンセル (1858-1918) が創案し、1905年に発表した、色を表現する方式の一つです。現在のマンセル表色系は、マンセルの発表から約40年後の1943年に発表された、修正マンセル表色系が基となっています。日では、物体色の表色系(JIS)として一般的に使用されています。マンセル記号は、H V/C (色相 明度/彩度) の順に書き、無彩色はN9.0 (白) や N1.0 (黒) のように表現します。

    マンセル表色系の色見本 - color-sample.com
  • 「色相環」とか「トーン」ってどう使うの?配色のコツは「ジャッドの色彩調和論」 | WebNAUT by Beeworks

    こんにちは、デザイナーのタカハマです。「キーカラーは決まったけど、色数を増やすと変になる…」「いつも色選びがワンパターン」「色相環ってどうやって使うの?」そんな色選びのお悩みをズバっと解決するかもしれない、配色のコツをご紹介します。また、キーカラー選びの段階から悩んでいる方は、前回の記事(色の基礎知識と色彩心理)が役に立つかもしれませんので、あわせてご覧ください。 「ジャッドの色彩調和論」と配色のための3Step ひとくちに配色理論と言っても、ニュートンやゲーテに始まり多くの学者や画家がそれぞれの持論を展開してきており、これが正しいというものはありません。今回は、その中でも20世紀半ばまでの先人たちの色彩調和論を”4つの原理”にまとめた「ジャッドの色彩調和論」に焦点をあて、配色のための3Stepをご紹介します。 (記事の内容に明らかな間違いがあれば、ご一報いただければ幸いです。) Ste

    「色相環」とか「トーン」ってどう使うの?配色のコツは「ジャッドの色彩調和論」 | WebNAUT by Beeworks
  • 色彩学 -配色調和論-

    シュブルール(仏)の調和論 「色彩の同時対比」を刊行 類似色の調和 同一色相の同一&類似トーン配色 隣接色相の類似トーン配色 隣接配色&隣接色相のドミナントカラー配色 対照の調和 同一色相の対照トーン配色 隣接色相の(明度の)対照トーン配色 対照or補色色相の対照トーン配色 オストワルト(独)の調和論 いわく「調和は秩序に等しい」 明度差の等しい3色以上の灰色は調和する

  • カラフルな配色が苦手な人でも簡単にバランスが取れる6つの配色技法 | 株式会社WEB企画

    デザインの印象を大きく左右する配色。カラフルに仕上げたいのだけれど、何故か上手くいかない!なんだかバランスが悪い!なんて事はありませんか?今回は、そうやって悩みに悩んで考えすぎて、行き詰まってしまった時に参考になる配色技法をご紹介します。特に、多くの色を使った配色をする時に役立つ方法です。 今回の配色の原理 若干小難しい話になりますが、今回の配色の原理のご説明を。 アメリカの色彩学社が唱えた「4つの色彩調和論」があります。 1.秩序の原理…一定の法則による規則的に選ばれた色は調和する 2.なじみの原理…自然界にある色の変化や見慣れている配色は調和する 3.類似性の原理…どこか共通性のある色同士の配色は調和する 4.明瞭性の原理…合わせる色の関係(コントラストや明度など)がはっきりしていると調和する これからご紹介する配色技法は、色相環を規則的に分割していることから秩序の原理が当てはまります

    カラフルな配色が苦手な人でも簡単にバランスが取れる6つの配色技法 | 株式会社WEB企画
  • 配色はセンスじゃない、UIデザインで色をかんたんにキメるメソッド|Taiki IKEDA|note

    今日は先日勝手にリデザインしたPolipoliのデザインを使って、UIデザインを行う時に僕が普段どのように色を選択しているのかをとても正直に書いていこうと思います。僕がこれから記す方法に則って色を選べば、誰でもナウでヤングなアプリを作ることができます。 はじめるよ レイアウトに関してはイニシエよりご先祖様がお築きになられたルールに則って並べればオワ、オワリです。さっそくこのPolipoliベッチュー、タタキケンサキエディションに色をつけていきます。 1. メインカラーを選ぼうまずはじめにメインとなるカラーを決めます。Polipoliのテーマカラーはピンクなのでブラウザの検索欄に「pink flat ui design」と打ち込みます。イメージに近い色が出てきたらスポイトで吸い取りましょう。著作権にはくれぐれも注意してください責任は負いません。 Polipoliに関しては最初からメインカラー

    配色はセンスじゃない、UIデザインで色をかんたんにキメるメソッド|Taiki IKEDA|note
    teracy_junk
    teracy_junk 2019/03/14
    「ねっ、簡単でしょ」
  • ホームページ配色ツール Ver3 | フォルトゥナ

    ウェブ配色ツールが新しくなりました 1色を作れば自動的に配色を作るツールです。難しいツールではないので、多分使えばわかると思います。この写真も変えることができます。

    ホームページ配色ツール Ver3 | フォルトゥナ
  • ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP

    『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。

    ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP
  • ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP

    『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。

    ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP
  • 配色の見本帳 | キーカラーで選ぶ配色パターン - ホームページで作る配色

    Webで見るデジタル色彩見として 配色の見帳は無料のインターネットツールです。各色のページでは、Webカラー(RGBカラー)をベースとした色の系統(色相)と色の鮮やかさ(彩度)・明暗の度合い(明度)を数値で表しています。各種カラーモードでの色数値を掲載しています。DTPでチラシや看板を作るとき、ホームページといったWEBサイト作成、パワーポイントでの資料作成など、各種デザインでのカラーマネージメントに便利なカラーコードが一目でわかるWebで見るデジタル色見です。 色を扱うときに頻繁にぶち当たるのが配色ですが、色の法則に沿った色の組み合わせがテンプレートとなり色彩設計の手助けをしてくれます。 色検索で見つかる新配色 ベースとなる色、キーカラーを選ぶとそこからおすすめな相性の良い色をマッチングしてくれるのが当サイトの色検索です。メインに使う色が決まっているとき求める配色がすぐに見つけられ

    配色の見本帳 | キーカラーで選ぶ配色パターン - ホームページで作る配色
  • 一つのカラーから配色セオリーに基づいてカラースキームを作りだす配色設計に役立つツールのまとめ

    コーポレートカラーなど、一つのカラーをベースに配色セオリーからカラースキームを設計したり、同系色やグラデーションを作りだしたりできるオンラインツールを紹介します。 またカラーのストックを増やしたり、カラーをベースにしたムードボード作りに役立つツールもいくつか。 最初は、国産のツールから。 配色の見帳 | キーカラーで選ぶ配色パターン 一つのカラーをベースに、さまざまな色の法則から配色パターンを表示します。 上は緑みの青(#0099CE)をベースにしたもの。キャプチャの他に、彩度や明度による配色、色相環による配色など、さまざまな配色を表示します。説明付きなのも嬉しいポイントです。

  • Webサービスのイメージカラーを無作為に調べてみた|インターネット界隈の事を調べるお

    昨日、LINEのカンファレンスに行ってきたのですが、ぼんやりと「緑色を見るとLINEって感じだよなぁ」と思いました。これまで緑といえばあの渋谷の会社を連想してたのですが・・・。 他にも、色の組み合わせだけで特定のWebサービスを連想することができるものはあります。クリムゾンレッドだったら楽天とか。そんなわけで、Webサービスのイメージカラー(使用されている色)を調べてみました。なんだかオーラソーマ・カラーみたいです。 サービスはジャンル別に思いついたものを次々と取り上げた感じですので、脈絡がない箇所もあるかもしれません。色はスクリーンショットからのスポイトという地味な作業により調べております。 1、2行目はEC関連ですが、比較的暖色系も使われており、女性を意識したものも多いのかなって。逆に3行目はお堅いサービスなので青系が多い。以外なのがSNSも青系が多いんですね。3行目と4行目は配色が似

  • プログラマのためのカラーパレットツールを作りました - shoya.io

    Paletta - HSV Color palette for every Programmer 背景 フラットデザインの台頭によって、昨今のアプリ/サービス開発において「色選び」が重要視されています。例えば上の写真は次のトイレの時刻を機械学習で予測するRestCastというアプリですが、「いい感じの青」を基調としたタイルを敷くことで、トイレというワードをニオワセないデザインに仕上がるよう心がけてつくりました。 デザイナー/プログラマーの皆さんは普段どうやって色を選んでいるのでしょうか。多くの場合、既存のカラーパレットをぽちぽち選択したり、#123456のようなカラーコードを調整するのではないかと思います。実は、この方法で「いい感じの色」を選ぶのは難しいのです。その理由を色の表現方法を踏まえて説明します。 混色系と顕色系 色を数値で表現する方法を表色系といいます。オストワルト表色系やマンセ

  • ノンデザイナーこそ押さえておきたい! 配色・レイアウトの基礎が学べる7個の厳選スライド

    まだまだメンバーの数が少なく、職種ごとの距離が近いスタートアップ。デザイナーの仕事をディレクターやエンジニアが理解することが、プロジェクトを円滑に進める秘訣です。 デザイナーではない方々にとって、デザイナーが普段何を悩み、どのようにWebデザインしているのか知るのは、非常に重要と言えるでしょう。今回は厳選した7つのスライドをご紹介しながら、「配色」「レイアウト」といったデザインのエッセンスを学びます。 もちろん、職のデザイナーの方にも役立つスライド7連発です! 1.色彩センスのいらない配色講座 7000いいね! されたスライド 「時間がない! 今すぐ作り始めないと納期に間に合わない! でもどんな色を使ったらいいか分からない!」そんな人におすすめなのがコレ。Facebookで7000以上のいいね!がついた、@marippe_さんのモンスタースライドです。 配色や明度・彩度の基礎をお

  • 新着記事

    『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。

    新着記事
  • 0to255

    There are 16,777,216 color hex codes. With so many options, how do you choose the right color? The latest research on color perception tells us that somewhere between 40% to 99% of these colors are indistinguishable to the human eye.* Which begs the question: if we can't see the difference between two colors, why should we waste time deciding between them? What if you could easily narrow down the

  • 1