[CSS]スタイルシートの装飾のみでデザインしたタイポグラフィ集
Post on:2008年8月14日
Patrick Burtのエントリーから、スタイルシートの装飾のみでデザインした8つのロゴデザインを紹介します。
8 Examples of Logos Using Only CSS
指定は、左上から順に下記のようになっています。
1 2 3 |
<textarea name="code" class="html" cols="60" rows="5"> <span style=”color:#000000; letter-spacing:-2px; font:26px/28px Georgia, “Times New Roman”, Times, serif;”>patrick</span><span style=”color:#ff0000; letter-spacing:-2px; font:26px/28px Georgia, “Times New Roman”, Times, serif;”>burt</span> </textarea> |
1 2 3 |
<textarea name="code" class="html" cols="60" rows="5"> <span style=”color:#000000; letter-spacing:-2px; font:bold 26px/16px Arial, Helvetica, sans-serif;”>PATRICK</span><br /><span style=”color:#ff0000; letter-spacing:10px; font:12px/14px Arial, Helvetica, sans-serif;”>BURT</span> </textarea> |
1 2 3 |
<textarea name="code" class="html" cols="60" rows="5"> <span style=”color:#000000; letter-spacing:-1px; font:18px/28px Arial, Helvetica, sans-serif;”>PATRICK</span><span style=”color:#ff0000; letter-spacing:-1px; font:26px/28px Georgia, “Times New Roman”, Times, serif;”>burt</span> </textarea> |
1 2 3 |
<textarea name="code" class="html" cols="60" rows="5"> <span style=”color:#000000; letter-spacing:-2px; font:26px/28px Arial, Helvetica, sans-serif;”>PATRICK</span><span style=”color:#ff0000; letter-spacing:-1px; font:bold 26px/28px Arial, Helvetica, sans-serif;”>BURT</span> </textarea> |
1 2 3 |
<textarea name="code" class="html" cols="60" rows="5"> <span style=”color:#000000; letter-spacing:-2px; font:italic 26px/28px Arial, Helvetica, sans-serif;”>patrick</span><span style=”color:#ff0000; letter-spacing:-2px; font:26px/28px Arial, Helvetica, sans-serif;”>burt</span> </textarea> |
1 2 3 |
<textarea name="code" class="html" cols="60" rows="5"> <span style=”color:#000000; letter-spacing:-2px; font:26px/24px Arial, Helvetica, sans-serif;”>PATRICK</span><br /><span style=”color:#ff0000; letter-spacing:-3px; font:39px/26px Arial, Helvetica, sans-serif;”>BURT</span> </textarea> |
1 2 3 |
<textarea name="code" class="html" cols="60" rows="5"> <span style=”color:#000000; letter-spacing:-2px; font:bold 26px/28px Arial, Helvetica, sans-serif;”>patrick</span><span style=”color:#ff0000; letter-spacing:-2px; font:italic bold 26px/28px Georgia, ‘Times New Roman’, Times, serif;”>burt</span> </textarea> |
1 2 3 |
<textarea name="code" class="html" cols="60" rows="5"> <span style=”color:#000000; letter-spacing:-2px; font:italic 26px/26px Arial, Helvetica, sans-serif;”>PATRICK</span><br /><span style=”color:#ff0000; letter-spacing:-2px; font:italic bold 26px/14px Arial, Helvetica, sans-serif;”> BURT</span> </textarea> |
sponsors