ヘッドライトと黄ばみ・くすみをクリアに! マルチに使える高コスパなコーティング兼用クリーナー「ウルトライト」の先行販売が終了間近
![180種類のグラデーションがCSSと画像で手に入るサイト「WebGradients」 | ライフハッカー・ジャパン](https://cdn-ak-scissors.b.st-hatena.com/image/square/fc9fa070ddbdfffefd407e5ca596834a73813f6f/height=288;version=1;width=512/https%3A%2F%2Fmedia.loom-app.com%2Flifehacker%2Fdist%2Fimages%2F2017%2F02%2F170213_we.jpg%3Fw%3D1280%26h%3D630%26f%3Djpg)
最近のウェブデザインでよく見かける、鮮やかな配色のグラデーションカラーをお探しですか。 WebGradients は、どんなウェブサイトでも利用できる美しいグラデーションカラー180種類を揃えた、無料の配色コレクションツールです。ボタンをクリックするだけで、Internet Explorer や Chrome などクロスブラウザ対応のCSS3コードをコピペできます。使い勝手もよいので、ワークフローに加えたいサービスのひとつです。 詳細は以下から。 コピペ自由!美しいグラデーションを180種類揃えた WebGradients WebGradients では、配色の参考にしたい美しいグラデーションカラーが一覧で揃っており、使い方もとてもシンプルです。各パネルでは、2500x2500pxのPNGファイルをダウンロードできたり、使用している色のHEXコードもまとめて確認でき、Webデザイン制作に便
近年見かける機会が多くなった、クールなグラデーションカラーを知りたいときに便利なサイトのまとめです。 いずれもあらかじめグラデーションカラーの一覧が用意されているので、それらから選んでカラーコードやCSSで実装するためのコードを確認することができ、さらにサイトによってはそれを自分好みに調整してからコード出力したり、デザインで使える素材でダウンロードできるようにもなっています。 uiGradients ページ左右に配置されている矢印でカラーを切り替えていく他、もっと一覧化された状態で見たい場合は左上にある「Show all gradients」から確認でき、キーカラーを選んでフィルター表示にすることもできます。 カラーコードは画面中央上部に記載、その他のオプションについては画面右上にそれぞれ配置されており、角度変更(クリックの度に角度が変わります)・CSSコードの出力・JPG形式でのダウンロ
クオリティを上げるためにはちょっとした「こだわり」がとても大事です。 定期的に話題になるネタで恐縮ですが、素人っぽいデザインにならないように個人的によく使ってる小技をまとめました。 上のものほど、簡単で多くのデザインに使える小技になります。 1pxのボーダーを使う 1pxの効果を使うのと使わないのでは、デザインの質に大きな違いが生まれます。 ある意味Webデザインでは一番重要な要素かもしれません。 定番です。たった1pxのボーダーをつけるだけでシャープな印象になります。 ただ塗りつぶしただけ、グラデーションを入れただけのボタンでは、のっぺりとした感じになりやすいですが、1pxのボーダーを上部に入れるだけでシャープな立体を表現できます。 正確には1pxでなく2pxですが、こうして黒系のボーダーと白系のボーダーを並べることで、明確にかつシャープに仕切りを表現できます。 1pxのドロップシャ
2017年6月29日 Webデザイン 「デザインしてみたけどなんだか物足りない…」そんな経験ありませんか?私はよくあります。それで色を変えてみたり、形を変えてみたりと色々試してみるのですが、結局どれもしっくりこなかったり。そんな時は元のデザインにほんの少し手を加えるだけで納得のいくデザインに変わることが多いんです。わずかな装飾で大きく印象を変える。そんな「ひと手間」に注目してみましょう! ↑私が10年以上利用している会計ソフト! 追記:Photoshopを使った加工の仕方を記事にしてみました! » 【実践編】少しの手間で大きく変わる、細部にこだわったWebデザインを グラデーションを加える 「デザインしてみたけどなんだか物足りない…」そんな時はわずかなグラデーションを加えるだけで立体感がでて、ノッペリしたデザインを一新することができます。アレコレ装飾するよりもシンプルかつ王道。 ヘッダーの
☆ご注意☆ この記事は 2011年6月5日 に書いたものです。情報が古い可能性がありますのでご注意ください。 私も少しですがこの「1pxのこだわり」を日頃のデザインで使えるようになってきたので、制作方法とともにちょっとまとめてみました。 引き出しのひとつとして、デザイン勉強中の方、参考にしてもらえるとうれしいです^^ デザイン上級者の方々にとっては当然のことだと思うのですが、 最近つくづく思うのが、「1pxで質感が全然変わるよなぁ~」ってとても感じます。 たった1pxでピリッとしまったり、見やすくなったり、しゅっとなったり、、、と、1pxをないがしろにしちゃいけないんですねー… 今回は、私がデザイン制作時よく参考にしている、 デザイン参考集、bookma!さんの中から、色んなサイトを調べてみました。 目次 仕切り線の1px 文字をキリッと見せるための1px 動きのある1px 1pxの枠 仕
フォトショップのグラデーションファイルは作業を早めるのに役立ちますし、テンプレートだと色の参考にもなります。PhotoshopやGIMPの色合いが美しいグラデーションを厳選してまとめました。 追記: 2010/12/04 グラデーション追加/リンク切れチェック Photoshop Gradients Nice photoshop gradient set Download Source Web 2.0 Photoshop gradients Download Source Ultimate Web 2.0 Gradients - FREE Download Download Source 黄金比グラデーション・白銀比グラデーション | DesignWalker Download Source 日本の伝統色グラデーションファイル | DesignWalker Download Source
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く