赤みがかった緑｜kurosakayu
似てる色は？と聞かれて多数派の人はなに色となに色を思い浮かべるだろう。 例えば赤とオレンジ、緑と黄緑は似てるというかもしれない。 私の場合は赤と緑の２色を近いと感じるため、この色を含んだ異なるトーンのピンクと淡いグリーン、オレンジと黄緑なども近いと感じる。 緑に近いと感じるピンク オレンジに近いと感じる黄緑 一般的に似ているとされる色は赤みがかった茶色であるとか緑がかった青とか色相環を見ればわかるように隣りあい、混ざりあっても不自然でないことが示されている。 色相環 しかし私には赤みがかった緑(当然逆も)というのがある。 色相環を見るとこの2色は全く隣り合わない位置にある。 多数派の人には赤と緑というのはとても遠い色かもしれないけど、私にはとても似ていて境界が溶け合っているような曖昧な色だ。 胸をはって「ピンクグリーン」みたいな自分が感じたままの色を言えるようになりたい。
Please Stop Using Grey Text
An examination of design for readabilityAnd before we continue, let’s make it absolutely clear that we have no control of the color of the text in this very article, as it is hosted through Medium.com, which features poor visual accessibility of their site design. Further, Medium prevents their users from selecting black text as a choice. While Medium’s “Fischer-Price-simple” content creation is e
【CSS】「なんかグラデーションが汚くなるんだけど」を解決する。 - Qiita
概要 このグラデーションは、#ff0000 → #00ff00のグラデーションになります。 みなさんは、このクラデーションを見てどう思いますか？ 真ん中あたりの色が茶色っぽくなって あまり綺麗なグラデーションとは感じないですよね? この記事では、これが発生する原因と綺麗なグラデーションの作り方を 解説していきます。 この記事を読んで理解すれば、綺麗なグラデーションが簡単に作れるようになるでしょう。 原因 1. RGBについて理解する RGBは、赤（Red）、緑（Green）、青（Blue）の3つの色を それぞれ、0~255の値を指定することで、色が作られます。 例えば、 R: 255, G: 0, B: 0 → 赤 R: 255, G: 255, B: 0 → 黄色 このように色が指定されます。 では、RGB全てが同じ値の時はどんな色になるでしょうか？ 答えは、↑このようにグレースケールカ
やってほしくない緑とオレンジの使い方(カラーUDの話)｜ほうじ | 少数色覚デザイナー
少数色覚者にとって黄緑とオレンジは見分けづらい組み合わせの一つです。この記事のタイトル画像とかなかなか最悪です。 WEB、アプリや印刷物などのメディアではだいぶカラーユニバーサルデザインの考え方が浸透してきており、デザイナーも多様な色覚でも読み違えないように配慮してデザインすることが当たり前になってきていると思います。 Photoshopなどのグラフィックツールには簡単に少数色覚の見え方を確認できるプレビューモードがありますし、AdobeColorを使えば無料で少数色覚の人が混同しやすい色かどうかをすぐに確かめられます。https://color.adobe.com/ja/create/color-accessibility 少数色覚が見分けづらい色の組み合わせだと「-」が表示されるしかし、工業製品の世界では少数色覚にとって見分けづらい緑とオレンジの組み合わせのLEDインジケータ（表示）を
WebAIM: Contrast Checker
Explanation Enter a foreground and background color in RGB hexadecimal format or choose a color using the Color Picker. Enter an Alpha value to adjust the transparency of the foreground color. Use the Luminance slider to adjust the perceived lightness of the color. WCAG 2.0 level AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text. WCAG 2.1 requires a contrast rat
植物の葉の色はなぜ緑色か？ - tsujimotterのノートブック
夏です。木々の緑が鮮やかな季節がやってきました。 [tsujimotterの母校、北大にて撮影] 植物の葉を眺めてると、私はいつもこんな疑問を思い浮かべます。 どうして緑色なのだろうか？ 色は、私たちは幼い頃から知っている身近な存在です。その一方で、とても神秘的な存在でもあります。 色とは何だろうか？ 考えれば考えるほど、その正体が分からなくなってしまうのです。 たとえば、みなさんは色の仕組みに関するこんな問いに答えられるでしょうか？ ・空の色が青色なのはなぜだろう？（太陽の光は白色のはずなのに） ・絵具を混ぜて金色が作れないのはなぜだろう？（そもそも金色っていったい何なのだろう） ・モルフォチョウの翅の色がきらびやかな青色をしているのはなぜだろう？（自然界には青色をした物質はほとんどない） 今回考えたいのは「植物の葉はなぜ緑色なのか？」です。 この問いを突き詰めていくと、分子の中にある電
イメージスケールの基本 | カラー戦略の専門家 | NCD-WEB | 色彩心理・生活者研究・トレンド分析の日本カラーデザイン研究所
※一部のInternet Explorerで「データベースシステム」「Hue&Toneシステム」を閲覧できないケースが発生しております。 お手数ですが、別のブラウザでお試しください。 イメージスケールとは イメージスケールは日本カラーデザイン研究所が研究・開発した感性マッピングツールです。 色に対して抱くイメージは人によって微妙に異なりますが、共通する部分も多く認められます。そのイメージの共通感覚を心理学的研究の蓄積で明らかにしたものが、イメージスケールです。 基本のイメージスケールは、イメージの判断基準であるWARM－COOL、SOFT－HARDの座標軸上に単色、形容詞、形容動詞を表現した配色が配置されています。(本来は第3軸としてCLEAR-GRAYISHの軸があり、3次元のイメージ空間となっています) ■カラーイメージスケール すべてのイメージスケールの元となっている単色イメージスケ
意味の色とカラーテーマ - Qiita
Emacs Advent Calendar 2020 の 9 日目の記事です。 おととしの Advent Calendar でカラーテーマについての話を書いたのですが、その後２年、実際に自分で使ってみて色々と考えが整理された＆実装も進化したので改めて紹介させてください。 当時の記事と重なる箇所もありますが、ご了承ください mm tl;dr 「色を持たない」カラーテーマによって、 Emacs の外観を簡単に、一貫性を保ってコントロールできるようにしました。 カラーテーマの責務 Emacs の Basic Faces Emacs には Basic Faces と呼ばれる、いくつかの特別な face があります。 default bold italic bold-italic underline fixed-pitch fixed-pitch-serif variable-pitch shado
GitHub Dark Mode is Too Dark - blog.karenying.com
GitHub Dark Mode is Too DarkIf you hate it too this is why. Using color theory to show why GitHub dark mode is disappointing Shared on Hacker News and Twitter This past week, GitHub released a long-awaited feature — dark mode. Like many devs around the world, I was hype. In 2020, a dark mode toggle for anything remotely related to tech seems like a requirement. So I flipped the switch. My immediat
カラーユニバーサルデザイン 推奨配色セット ガイドブック第2版
Skip to content TOP tagsCUD友の会色覚異常色弱CUDカラーユニバーサルデザイン色覚検査CUDO賛助会員の集い 新着情報 office用のCUDテーマインストーラを配布しています。 ひとつの色世界 募集期間を延長 ２０２３年は１月５日からです サイトのハッキング被害の報告 CUD友の会開催のお知らせ 00お知らせ ひとつの色世界 募集期間を延長 12月 28, 2022 cudo 事務局i 00お知らせ ２０２３年は１月５日からです 12月 28, 2022 cudo 事務局i 00お知らせ サイトのハッキング被害の報告 12月 27, 2022 cudo 事務局i 00お知らせ CUD友の会開催のお知らせ 12月 11, 2022 cudo 事務局i 00お知らせ 第5回ロービジョン・ブラインド川柳の募集開始｜2022年12月1日〜2023年1月31日 12月 1
あなたが落とした monokai テーマとターミナルの真の姿 - Qiita
ああっ！ あなたはうっかり monokai テーマを泉の中に落としてしまった！！ 「そ、そんな……！ おらの monokai テーマが……！！」 あなたは地面に手をつき、必死で泉の水を掬ったが…… monokai は、泉の底へと沈んでいったようだった。 そのとき、泉の上に光の窓が現れた 窓から光が溢れ出し、光は人の姿を象った。 頭上には光の輪が燦然と輝いている。背からは翼が生えていた。 『……ますか……聞こえていますか』 『今、あなたの心に直接呼びかけています……』 「め、女神様？！」 女神はあなたに問いかける 『あなたが落としたのは、赤の monokai ですか』 『黄色の monokai ですか』 『それとも、茶色の monokai ですか』 どれが本当の monokai なのか？ 「女神様」 「おらが落とした monokai は、その中にはありませんですだ」 『……そうですか。お役に
Free Gradients Collection by itmeo.com
Free for commercial or personal use by Dima Braven. WebGradients is a free collection of 180 linear gradients that you can use as content backdrops in any part of your website. Easy copy CSS3 crossbrowser code and use it in a moment! We've also prepared a .PNG version of each gradient. As a bonus, there are packs for Sketch & Photoshop.
色彩検定１級がオススメする 🎨 配色Webツール５選 - Qiita
こんにちは。ちょっと自分でもどこを目指しているのかわからない 1 あずきしろもち（@azukisiromochi） です。 今回は 配色Webサービス のお話。 ターゲットとしては 「色彩学とか配色理論とかどうでもいいから、手軽にそれっぽい配色を決めてくれるツールはよ！」 って感じで、配色には時間をかけず、（コーディングなどの）本題に時間を掛けたいという層です。 ということで、難しい操作なく配色を決定できるツールを紹介していきます ❗ Random material palette 概要・使用感 クリックするだけでランダムな3色配色を生成してくれる Web サービス。 配色を確認できるテンプレートも複数あり（ Text template 、Card template 、 Vertical template ……）、用途に合わせて利用できるのも Good ！ また、クリックで生成された配色は
これだけ守れば見やすくなるデザインの基礎
2019/04/18に株式会社gumi様で行ったデザイン講義のスライドです。 デザインとは何か？デザイナーは何を考えてデザインを作っているのか？ という話から、実際にデザインを評価・検討するための言葉を紹介しています。 この 作品 は クリエイティブ・コモンズ 表示 - 改変禁止 4.0 国際 ライセンスの下に提供されています。 第二回「UIデザインをはじめよう」はこちら https://speakerdeck.com/kinakobooster/uidezainwohazimeyou 第三回「今日からできるUXデザイン」はこちら https://speakerdeck.com/kinakobooster/jin-ri-karadekiruuxdezain ※訪問講座のご案内※ あなたの会社に話しに行きます。料金表はこちら https://xemono.life/#/workwith/co
コントラスト比が低いUIは20人に1人以上に影響! 対策をまとめてみた | DevelopersIO
はじめに スマホアプリやWebアプリで、ボタンなどのUIを作る場合を考えます。例えばボタンの色と、その上の"OK"などのテキストの色を決める際に注意すべき点を紹介します。UIだけでなく、ドキュメントの図やプレゼン資料など、色を使う全ての場面に使えます。 例えば、スマホアプリに次のようなボタンがあるとします。 こういう配色のボタン、よく見ますよね。ところが、このボタンは背景の黄緑色と「今すぐ購入」のフォントの白の「コントラスト比」が低い、つまり「色の明るさの差」が少ないので、「文字が薄くて読めない」と感じるユーザーが存在します。 人間の色の感じ方はみな同じではなく、遺伝子の状況や疾患などによって異なります。例えば、正常とされる人とは異なった色に見えたり感じたりする「先天性色覚異常」は、日本人男性の20人に１人(5%)、日本人女性の500人に1人(0.2%)といわれており、男性ではAB型の血液
配色はセンスじゃない、UIデザインで色をかんたんにキメるメソッド｜Taiki IKEDA｜note
今日は先日勝手にリデザインしたPolipoliのデザインを使って、UIデザインを行う時に僕が普段どのように色を選択しているのかをとても正直に書いていこうと思います。僕がこれから記す方法に則って色を選べば、誰でもナウでヤングなアプリを作ることができます。 はじめるよ レイアウトに関してはイニシエよりご先祖様がお築きになられたルールに則って並べればオワ、オワリです。さっそくこのPolipoliベッチュー、タタキケンサキエディションに色をつけていきます。 1. メインカラーを選ぼうまずはじめにメインとなるカラーを決めます。Polipoliのテーマカラーはピンクなのでブラウザの検索欄に「pink flat ui design」と打ち込みます。イメージに近い色が出てきたらスポイトで吸い取りましょう。著作権にはくれぐれも注意してください責任は負いません。 Polipoliに関しては最初からメインカラー
yum-yum COLOR
yum-yum COLOR is a web service that can intuitively select color combinations.
ぼくのかんがえたさいきょうの配色Webサービスを公開した話 - Qiita
TL;DR まあぜんぜん最強ではないですが、自分好みの配色 Web サービスをつくってみました yum-yum COLOR 個人で公開まで作りきったのは初めてでしたので、色々とつまずきました そんなつまずきポイントや、 Web サービスを公開するために利用した技術などを紹介していきます ❗ なぜ配色サービス ❓ 色彩検定という資格をご存知でしょうか？ 僕はプログラマーなのに 色が好き で、この試験を受検しました。 その学習をしてる時にこんな風に思ったのです。 この色相環、これを使って配色選べたら便利じゃない？ あっ、このトーン、これを使って配色選べたら便利じゃない？？ と。 受検勉強の追い込みをしないといけないのに、そっちのけで作り始めてしまった...というわけです （一時はどうなるかと思いましたが、無事に検定は合格しましたよ 🎉 ） どんなサービスなの ❓ 使い方 色相環 と Hue
一般色覚者にはほぼ分からない“小さくて大きな違い” JIS改訂で「日本社会における色のルール」はどう変わったのか
道路工事中の赤ランプ、踏切、非常口のマーク―― 2018年4月、JIS（日本工業規格）の改訂に伴い、こういった場所に使われている「安全色」が変わったことをご存じでしょうか。 設備の入れ替わりに時間がかかるため、ひょっとしたら、まだ“新色版”を目にしていない人もいるかもしれません。ですが、仮に見ていたとしても、多くの人は気付かないままでしょう。というのも、一般的な色覚を持つ人には、“小さな違い”しか分からない調整が行われているからです。 上下どちらが改訂前、改訂後なのか分かりますか？ しかし、この改訂により、あるタイプの色弱者には「色味が感じられなかった標識がカラーになる」など“大きな変化”があるのだといいます。安全色に起こった小さくて大きな変化とは、どのようなものなのか。CUDO（カラーユニバーサルデザイン機構）副理事長・伊賀公一氏に話を伺いました。 本記事はテーマ別に分けた3編構成となり
PANTONEが選ぶ2019年の色「Living Coral」を使った配色例 | Webクリエイターボックス
2018年12月7日 インスピレーション, 色彩 毎年恒例、PANTONEによる「来年の色」が発表されました！2019年は「Living Coral」に決まりました。ぱっと明るく、前向きになれるような可愛らしい色ですね。そんな「Living Coral」に注目してみたいと思います。 「Living Coral」ってどんな色？ ポップで活発でポジティブで。誰とでも打ち解けられるような社交性や暖かい優しさも感じられるような魅力があります。単色で使っても画面が賑やかに彩れそうですね！ 色の具体的な数値は以下の通り： PANTONE：16-1546 Living Coral カラーコード：#FF6F61 RGB：R255, G111, B97 CMTK：C0, M65, Y54, K0 「Living Coral」色の写真素材 Adobe Stockでは「2019 年の Pantone カラー」特
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
