[CSS]見出し、本文、リストなど、文字周りをrem指定で簡単に設計できる便利なオンラインツール | コリス

2018/08/03 94 users コリス SCSS 小見出し 行間 マージン

Webデザインで使用する見出し、小見出し、本文、リストなどフォントの基本サイズ、行間、それぞれのマージンなど、文字周りのデザインを実際のブラウザで確認しながら設計できる便利なオンラインツールを紹介します。 ルート要素を最初に定義して、それを元に見出しや本文を設計するので、rem指定も可能。また、SCSSもサ... 続きを読む

Photoshopで文字をよりシャープにクリアに見せるこつ -1px未満のこだわり | コリス

2013/07/29 411 users コリス Dribbble ビジター コツ Photoshop

dribbbleに投稿されたデザインで、コメントのやり取りがちょっと興味深いものなので紹介します。 簡単に意訳すると、 ビジター「デザインきれいだな、文字周りの処理に秘訣とかあるの？」 オーナー「文字をクリアにみせるために、Photoshopでこういう風にやってるよ。」 という感じです。 Site テクニックの紹介の前に、まずは文字周りを実寸大にしたものから。 Site -実寸大画像 カラーのコン... 続きを読む

Photoshopでテキストを水彩風にする方法。 | Handy Web Design

2013/03/26 77 users Photoshop ブラシ 水彩風 テキスト タイトル

Photoshopは色々な機能がついていてややこしいですが、簡単な機能でもいろいろできるという意味もこめてご紹介しますー。手作業っぽい部分が多いので、タイトルなどの文字周りに使える方法だと思います。 1.文字を配置する とりあえず好きな文字を配置します。今回は水彩風に似合うタイトルを使ってみます。 2.文字の上に着色する 文字の上に新規レイヤーを作り、そこにブラシで色をつけます。ブラシはウエットメ... 続きを読む

Fireworksで覚えておくと便利な文字設定まわりのTips | Webデザインのタネ

2012/07/09 330 users Fireworks モック タネ Tips グラフィック

FireworksやPhotoshopなどのグラフィックツールでWebデザインのモックを作る際、文字ツールは矩形ツールより多く使うことが多く、文字設定のショートカットを覚えているだけでも効率は全然違います。グラフィックソフトで一番に覚えるべきショートカットは何かと聞かれたら間違いなく文字周りのショートカットです！ 今日はFireworksで覚えておくと便利な文字設定のTipsや拡張機能をまとめてお... 続きを読む