prajnaworksのブックマーク / 2017年3月1日

prajnaworks id:prajnaworks

2017年3月1日のブックマーク (2件)

テキストやボーダーや背景に使うグレーを効果的に、ニュートラルなカラーを使いこなすためのテクニック
Webデザインで大切なカラーはベースカラーやアクセントカラー、そしてブランドのカラーがありますが、テキストやボーダーや背景などのコンポーネントに使うニュートラルなカラーも非常に重要です。明るいニュートラルなカラー、暗いニュートラルなカラーをWebデザインで使いこなすためのテクニックを紹介します。 Light & Dark Color Systems 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。明るいカラーと暗いカラーを使用する準備明るいカラーと暗いカラーを理解する明るいカラーと暗いカラーをカラーパレットで使う時の注意点明るいカラーと暗いカラーを使用する準備コンポーネントで使用するニュートラルカラーカラーを選ぶ前に大切なのは、すでに使用しているニュートラルなカラーを調べることです。実際に一部のライブラリでは、すでに
prajnaworks 2017/03/01
グレーサイト WEB
リンク
[CSS]ヘッダやコンテンツを区切るラインを斜めに実装するCSSやSVGのテクニック総まとめ
長方形ではないヘッダやコンテンツが最近増えてきました。その一つとしてヘッダの下、コンテンツを区切るラインを斜めにすることで、簡単にデザインの印象を変えることができます。一見シンプルに見えますが、実装するには慎重を要します。ラインを斜めに実装するCSSやSVGのテクニックをコードのシンプルさ、コンテンツの生成、対応ブラウザ、パフォーマンスの面から実装に適した方法を詳しく紹介します。 Ultimate Guide to Non-Rectangular Headers 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。斜めのラインをCSSやSVGで作成する方法斜めのラインをCSSのボーダーで作成斜めのラインをCSSのグラデーションで作成斜めのラインをCSSのシェイプで作成斜めのラインをSVGの背景で作成斜めのラインをSVGの
prajnaworks 2017/03/01
css SVG 斜め表現
リンク
- 2017年3月3日
- 2017年3月1日
- 2017年2月28日