ColorbaseAll-in-one color tool for creators
CSS の Container Queries おためし - 見返すかもしれないメモ
CSS に、コンテナクエリという機能があるらしい。 メディアクエリでは画面全体の大きさに応じて要素のスタイルを変えることができたけど、コンテナクエリを使うと当該要素の親の大きさに応じてスタイルを変えられる。 /* メディアクエリの例 */ /* 画面幅が 400px 以下だったら、div を赤くする */ @media screen and (max-width: 400px) { div { background-color: red; } } /* コンテナクエリの例 */ /* div の親要素の幅が 400px 以下だったら、div を赤くする */ @container (max-width: 400px) { div { background-color: red; } } その機能が Google Chrome Canary で使えるようにされたと聞いたので、使ってみた。 こ
配色はセンスじゃない、UIデザインで色をかんたんにキメるメソッド｜Taiki IKEDA｜note
今日は先日勝手にリデザインしたPolipoliのデザインを使って、UIデザインを行う時に僕が普段どのように色を選択しているのかをとても正直に書いていこうと思います。僕がこれから記す方法に則って色を選べば、誰でもナウでヤングなアプリを作ることができます。 はじめるよ レイアウトに関してはイニシエよりご先祖様がお築きになられたルールに則って並べればオワ、オワリです。さっそくこのPolipoliベッチュー、タタキケンサキエディションに色をつけていきます。 1. メインカラーを選ぼうまずはじめにメインとなるカラーを決めます。Polipoliのテーマカラーはピンクなのでブラウザの検索欄に「pink flat ui design」と打ち込みます。イメージに近い色が出てきたらスポイトで吸い取りましょう。著作権にはくれぐれも注意してください責任は負いません。 Polipoliに関しては最初からメインカラー
シャドウの色はブラックとは限らない、さまざまなカラーにあった適切なシャドウの色が分かるオンラインツール
最近のWebデザインには使用される要素には、さまざまなカラーが使用されています。それらの要素にシャドウを与える際には、シャドウの色はブラックとは限りません。グレーであればグレー系シャドウ、レッドであればレッド系シャドウがぴったりです。 さまざまなカラーにあった適切なシャドウの色が分かるオンラインツールを紹介します。
その文字、薄すぎない？ デザインにおける灰色の明度は何%が最適か
UX Movementにおいて記者、編集長を務めます。明快で効果的なデザインに美点を見出し、利用者のために払う労力を惜しみません。 一言で灰色と言っても、明るいものもあれば暗いものもあり、実に様々なバリエーションがあります。Webサイトなどでは、いたるところでお目にかかることのできる色でもあります。濃い灰色は主に見出しや本文に、薄い灰色はメタデータ、分類名、説明文に多く使われます。これらの色合いのうち、最も乱用されるのは薄い灰色です。 薄い灰色の文字の問題点 文字色として薄すぎる灰色は可読性に問題を起こしかねません。灰色の文字を薄くしすぎてしまえば、読者が読むにあたって支障をきたすことになります。文字の明度によっては、薄い色の背景に混ざってしまうのです。この現象は、単語や文字をぼやけさせ、判読を困難にします。無理に判読を試みれば、目を傷めてしまうでしょう。 また、薄い灰色の文字は読者の誘導
まだCMYKで消耗してるの？〜大幅な色補正をCMYKで行ってはいけない理由〜
カッとなってつけた（タイトル）今は反省している。 正確には、「CMYKモードでの色調補正は微調整に止めるべき」理由、です。入稿データを問答無用でCMYK変換してから補正する方に向けて書いてます。 注意）この記事にはCMYK変換方法についての内容はありません。
これだけ読めば大丈夫！デザインの基礎が学べる厳選5記事｜ferret [フェレット]
ferret編集部：2014年12月11日に公開された記事を再編集しています。 「デザインに関しては、全くわからないからデザイナーさんに全てお任せ！」 「デザインは感性や才能だし、なんて伝えていいかもわからない。」 と感じる方も多いのではないでしょうか？ デザインが本業でない場合、時間を割くのが難しいという担当者さんが多いのが現状です。 しかし、デザインの多くは原理原則や、法則に則ったうえで考えられています。少しでも理解することでデザイナーさんとの連携もスムーズになりますし、なによりクオリティが上がること間違いないです。 今回は、デザインの原理原則が分かりやすく書かれている記事をまとめました。 1.デザインの基礎 【追記あり】【初心者】デザインってなんだ？「デザイン」の概念と、４つの基本原則を知ろう http://wp-e.org/2014/03/09/995/ こちらの記事では、そもそも
![これだけ読めば大丈夫！デザインの基礎が学べる厳選5記事｜ferret [フェレット]](https://cdn-ak-scissors.b.st-hatena.com/image/square/737c1201be8e91c4ffb6b8253f2f3a5fc2f857f3/height=288;version=1;width=512/https%3A%2F%2Fferret.akamaized.net%2Fuploads%2Farticle%2F467%2Feyecatch%2Fdefault-e50f142a015d29fc107e85693be29ce9.jpeg)
エンジニアのための配色まとめ - Qiita
無彩色 白と黒との混合で得られる色（白と黒自体も含む）の総称。 白・黒・さまざまな濃度の灰色が含まれる。 彩度が0であることを表す。 無彩色でない色は、有彩色である。 via 写真技術 色と陰影（手代木さんblogより） - 写真技術と光への道でフォトディレクション-Jimdo撮影編 有彩色 白、黒、灰色以外の色味を持った色のこと。 有彩色にはさらに、純色、清色、中間色に分類される。 以下のような図を、 等色相面 と言う。 via 純色、清色、中間色｜株式会社ノイエデザイン 純色 各色相において、最も彩度が高い色。 ただし、色空間によっては純色以外にも彩度が最大になる色がある。 清色 清色はさらに、明清色、暗清色に分類される。 清色にはくすんだ印象がなく、濁りがない色という特徴がある。 明清色 純色に白だけを加えた色。 ピンクや水色など 暗清色 純色に黒だけを加えた色。 紺色や茶色など 中
普段あまり使わないカラーの組み合わせを効果的に使う方法
Purple bud - EXPLORE - グリーンとパープルの組み合わせがよく見えると思ったことがあるでしょうか？ グリーンとパープルを使う時は、あまり暗くならないようにします。ダークパープルやペイルグリーンは良さそうには見えません。 カラースキームとしてもっとも良いのはあまり暗くないパープルと暖色系のグリーンです。 ブルーとイエロー yellow strings [ad#ad-2] ブルーを使おうと考えた際、一緒にイエローを使おうと思うのは非常にまれです。しかし、この二つを使って作られるエフェクトに驚くでしょう。これらのカラーでウェブサイトをデザインするとき、もしブルーをメインに使うのであれば、もっとも良い見栄えになるでしょう。イエローを多く使うとより明るくなり、サイトがあまりにもブルーが多すぎる時に効果的です。 イエローを使う時は、単に明るいイエローではなく、際立っていない薄いイエ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
色彩センスのいらない配色講座