無料でウェブデザインに最適な配色実例をそのままコピペできるようにした「Happy Hues」レビュー
色は人の心理に働きかけることが知られており、デザインに何色を使うかは重要な問題です。特に、異なる色を使いつつ統一感を持たせるのは至難の業で、一歩間違うとまとまりやメッセージ性のない配色になってしまうことも。そこで、プロのデザイナーがウェブデザインのさまざまな配色実例をそのままコピーできる「Happy Hues」を作成し、無料で公開しています。 Happy Hues - Curated colors in context. https://www.happyhues.co/ トップページには画面左側にパレットが表示されています。パレットをクリックすることで、画面右側の配色を変更可能。深緑を中心とした落ち着いた配色から…… ピンクを中心としたファンシーな配色。 グレーベースのシンプルなデザイン。 温かみがある焦げ茶色ベースの配色など、背景だけでなく文字色やボタン、イラストの色まで変わるので画面
Search by Muzli
Search, discover, test and create beautiful color palettes for your projects
デザイン的に合う色の組み合わせを指定されたカラーをベースに生成する無料ツール -Color Designer
色の組み合わせに悩んだ時、指定されたカラーをベースにその色の明るい色合いと暗い色合いをはじめ、補色、類似色、分裂補色、3色配色、4色配色など、色の組み合わせを簡単に自動で生成できるオンラインツールを紹介します。 カラーのセンスがなくても、デザイン的に合った組み合わせが分かります。
簡単にきれいな配色デザインが作れる無料ツール「ColorHexa」 | WordPressやWebデザインなど紹介 Ocadweb
前回、WEB上で画像やテキストなどのカラーを識別できるGoogle Chromeの機能を紹介しましたが、今回は色を識別してから、 色彩センスがないけど、きれいな配色が作りたい！！ この色には何色と合うんだろう？ とお困りではないですか。 【色を識別する記事】これ何色？画像やテキストなどWEB上の色を簡単に識別するGoogleChromeの機能 今回は、どんな色か特定できてもその色がどんなものなのか、相性の良い色はどの色なのか、配色を検討する参考にできる無料のオンラインツールを紹介します。 紹介する記事の中でこのサイトのロゴなどのテーマカラー「#d86e3a」をもとに紹介します。 簡単にきれいな配色デザインが作れるColorHexaって？ 前述していますが、「どんな色か特定できてもその色がどんなものなのか」、「相性の良い色はどの色なのか」、配色を検討する際に参考にできる無料のツールで、色彩セ
デザインで色の組み合わせを決めるのに役立つ便利なオンラインツールのまとめ
一つのカラーを元にそれにあったカラーパレットやグラデーションを作成したり、トレンドカラーを使った配色サンプル、アクセシビリティガイドラインに沿ったカラーパレットなど、配色設計に役立つオンラインツールを紹介します。 Coolors オススメの組み合わせを次々に表示してくれるオンラインサービス。 スペースキーor右のアイコンでランダムカラー、ロックでカラー固定、さまざまなファイル形式にエクスポートもできます。
Webデザインのカラー、レイアウト、エフェクトなどのアイデアに困った時に時間をかけて見たいサイトのまとめ
Webデザインのカラー、レイアウト、エフェクトなどのアイデアに困った時に時間をかけて見たいサイトのまとめ
おしゃれな配色パターンが見つかるサイト+アプリ10選 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
先日、個人でやっているサイトをリニューアルしていたのですが、想像以上に色の組み合わせについて悩んでしまいました。 デザインの知識が皆無の私にはハードルが高すぎたようで、文字、リンク、バナー、背景などの色をベタベタ触っていたら、数時間後にはヘドロのような色彩美のサイトが誕生しました。絶望です。 そこで今回は、私のような素人でも参考になる配色見本サイトについて、用途別にまとめてみました。 「わからないこと」が一瞬で解決するかも？ Webデザインを効率的に学びたい、転職・就職を目指している、誰かに教えてもらいたい……という方は、「スクールでの勉強」もおすすめです。LIGのスクールでは、現役デザイナーがマンツーマンで指導します！ ▼少しでも気になる方は、ぜひ公式サイトをご覧ください！ ベースとなるカラーを設定したい 1． 原色大辞典 https://www.colordic.org/ いつも参考に
次々とセンスある配色パターンを提案してくれるサイト「Coolors」 | ライフハッカー・ジャパン
フォームローラーでほぐし続けた結果...ようやくわかった効果とメリット3つ #Amazonプライムデー
配色に悩んだ時に役立つ便利なサイトやカラー関連ツールまとめ - NxWorld
「いつも同じような感じになってしまう」「このキーカラーに対してどんなアクセントカラーが合うのか」といったデザイン（配色）時の悩みを手助けしてくれるものやインスピレーションをもらえるもの、オリジナルのカラーパレットを簡単に作成・出力できるなど、配色・カラーに関連する便利なサイトやツールのまとめです。 似たようなサイトも多いですが、使いやすさ・見やすさ・情報量などの点でそれぞれ違いがあるので、こういったツールをお探しの方はひと通り試して自分に合ったものを見つけてみてください。 December 22, 2014 追記 「Material Design Color Palette Generator - Material Palette」「Material UI | Material UI Colors」「flatuicolorpicker : Best Flat Colors For UI D
[Generator] Coolors - ランダム生成してくれるカラーパレット
[Generator] Coolors – ランダム生成してくれるカラーパレット Pocket Tweet ランダムにカラーパレットを生成してくれるジェネレーター。使い方は簡単で、スペースキーを押すだけで5色のカラーをランダムに変更してくれます。またこの際、キープしたい色をクリックするとロックでき、ロックされてない色のみを変更する事もできます。それだけの機能のシンプルなジェネレーター。またURLをコピーするだけでこのような形でパレットを他人と共有する事もできます。例えばキーカラー1色のみ決まってて他の色どうしようか迷ってる時なんかに便利そうですね。 Coolors
グラデーションを楽しみながらコード取得もできるサイト「uiGradients」
デザイン制作の際に、色合いにニュアンスを出すために使用されるグラデーション。きれいな色の組み合わせが成功するとデザインが一気に魅力的なものに変化することも。今回はそんなシーンで役立てたい、グラデーションを楽しみながらコード取得もできるサイト「uiGradients」を紹介したいと思います。 ひたすらグラデーションを閲覧するといった非常にシンプルなサイトですが、色の濃淡のコード取得ができるなど実用的にも活用できるサイトとなっています。 詳しくは以下 サイトの左右にある矢印をクリックすることで、グラデーションの色がどんどんと変化していきます。淡い色合いから濃淡のハッキリしたものまでいろいろな種類をチェックすることができ、左上にあるCSSコードを利用すれば実際に色を再現することが可能。左下の「Get CSS code」を押せば簡単にコードコピーもできるようになっているのも魅力です。 グラデーショ
BrandColors
Close Modal About BrandColors BrandColors was created by DesignBombs. The goal was to create a helpful reference for the brand color codes that are needed most often. It's been featured by Smashing Magazine, CSS-Tricks, Web Design Depot, Tuts+, and over 2 million pageviews. There are now over 600 brands with 1600 colors and the collection is always growing.
無料で配色シミュレーションができるカラーパレット系サービス6選【2022年最新】 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、デザイナーのモモコです。 今回はデザインの重要な要素の一つである、色選びの時に使える配色シミュレーションができるツールやサイトをご紹介します。Webカラーのカラーパレット系サービスを中心にチョイスしましたので、配色などでお悩みの方はぜひご参考にしてみてください！ 独学でつまずいていませんか？ 配色やデザインの基礎を効率的に学びたい、誰かに教えてもらいたい……という方は、「スクールでの勉強」もおすすめです。LIGでもWebクリエイター育成スクール「デジタルハリウッドSTUDIO by LIG」を運営しております。「今すぐスクールの概要を知りたい！」という方は、ぜひこちらより資料をご請求ください。 coolors https://coolors.co/ 直感的な操作で色の組み合わせのシミュレーションができるサイト。スペースキーを押すことで自動で配色を行なってくれます。何度でも押せる
指定したウェブサイトの配色一覧を作成してくれるサービス「Colours」 : 二十歳街道まっしぐら
Coloursはウェブサイトで使われている配色を網羅できるサイトです。 解析したいウェブサイトのURLを指定すると、 そのサイトで使われている配色が一覧で表示されます。 また、どの色がどれくらい使われているかの分布も確認できますよ。 そのサイトと同じような配色を使っている類似サイトも教えてくれます。 ウェブサイトの配色決めの参考になりそうですね。 以下に使ってみた様子を載せておきます。 まず「Colours」にアクセスしましょう。 解析したいサイトのURLを入力します。 しばらく解析に時間がかかるので、待ちましょう。 （解析失敗になることも・・・しかしもう一度解析してみるとうまくいったり） このように結果が表示されました。 ブログ内で使われている色が一覧で表示されています。 茶色メインでおじさんくさくなってますね・・・。 色の分布です。 この下に、同じような配色をしている類似サイトも表示さ
[CSS]日本語にもマッチする、見出しの文字をかっこよくするスタイルシートのまとめ | コリス
This is a Headline ブラウザはChrome, SafariのWebkit系でご覧ください。 各スタイルとともに、スタイルシートを紹介します。 とその前に、HTMLはごくシンプルです。 <h1 class="vintage">美しい日本語</h1> ヴィンテージ風にスタイルします。 .vintage{ background: #EEE url(data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAIAAAAmkwkpAAAAHklEQVQImWNkYGBgYGD4//8/A5wF5SBYyAr+//8PAPOCFO0Q2zq7AAAAAElFTkSuQmCC) repeat; text-shadow: 5px -5px black, 4px -4px white; font-weight: bold; -webkit
お盆休みにまとめ読み！Web制作のおすすめスライド デザイン編
今年のお盆は9連休の方も多いのではないでしょうか... / おすすめスライド デザイン編 / Webデザインのウソ・ホント ～ Web らしく...他...全21件 今年のお盆は9連休の方も多いのではないでしょうか？ お休み中に時間を持て余すようでしたら、過去にご紹介したスライドを読み直してみませんか？きっと新たな発見があるはず。 そんなスライドを厳選してまとめました。まずはデザイン編から。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
新着記事
新着記事
http://handywebdesign.net/2013/12/slide-share-about-color/
http://handywebdesign.net/2013/09/the-point-for-improving-my-skills/
