[CSS]スタイルシートの装飾のみでデザインしたタイポグラフィ集

Patrick Burtのエントリーから、スタイルシートの装飾のみでデザインした８つのロゴデザインを紹介します。

8 Examples of Logos Using Only CSS

指定は、左上から順に下記のようになっています。

<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>

<span style=”color:#000000; letter-spacing:-2px; font:bold 26px/16px Arial, Helvetica, sans-serif;”>PATRICK</span><span style=”color:#ff0000; letter-spacing:10px; font:12px/14px Arial, Helvetica, sans-serif;”>BURT</span>

<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>

<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>

<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>

<span style=”color:#000000; letter-spacing:-2px; font:26px/24px Arial, Helvetica, sans-serif;”>PATRICK</span><span style=”color:#ff0000; letter-spacing:-3px; font:39px/26px Arial, Helvetica, sans-serif;”>BURT</span>

<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>

<span style=”color:#000000; letter-spacing:-2px; font:italic 26px/26px Arial, Helvetica, sans-serif;”>PATRICK</span><span style=”color:#ff0000; letter-spacing:-2px; font:italic bold 26px/14px Arial, Helvetica, sans-serif;”> BURT</span>

Post on:2008年8月14日