メインコンテンツ

CSS3で綺麗なボタンを作ってくれるジェネレーター

(Mon)

Posted in デザイン

CSS3で綺麗なボタンを作る為のソースコードを吐き出してくれるジェネレーターです。
CSS3 Button Generator
他の人が作った(?)ボタンデザインを閲覧する事が出来、さらに気に入ったボタンデザインがあればソースコードを入手する事も可能です。
ソースコードが吐き出されるため、設置も簡単です。ボタンタグを任意の位置に挿入しCSSコードをCSSファイルの任意の位置に挿入するだけで簡単に綺麗なボタンを作る事が出来ます。

FC2ブログだとコメントの送信ボタンなどに使う事が出来るでしょう。
ユーザがついつい送信ボタンを押してみたくなるようなデザインを作ってみましょう。
スポンサーサイト

漫画、アニメ、ライトノベルのタイトルロゴジェネレーター

(Thu)

Posted in デザイン

もう有名ですが、ライトノベル「とある魔術の禁書目録」と漫画「らき☆すた」のタイトルロゴを生成するジェネレーターです。
こんなのが作れます。
とある櫻花の画像生成で生成出来る画像のサンプル
とある櫻花の画像生成
がぞ☆つく
ブームが終らないうちはサイトのロゴに使っても元ネタが分かってもらえそうですね。

とある櫻花の画像生成、がぞ☆つくはテキストを全て自由に選べる訳ではありません。「とある」と「の」は固定になってしまいます。
がぞ☆つくは間の星が固定になってしまいます。
サイトのタイトルロゴに使用するならば、サイトのタイトルも画像に合わせた名称に変更した方が良いでしょう。
また、生成される画像に透過処理は施されていないため、背景が黒いサイトに使うのならば画像を生成後に透過処理を施す必要があります。

試しに共有テンプレート「html5_common_01」にとある櫻花の画像生成で生成した画像を埋め込んでみましょう。
HTMLに直接imgタグで修正した場合、見た目では問題ありませんがサイトタイトル(h1タグ)を画像にしてしまうのは抵抗がありますのでCSSを使ったテキスト飛ばしでタイトルロゴを埋め込む方法を選択します。

完成図:
とある櫻花の画像生成で生成したタイトルロゴ画像を共有テンプレート「html5_common_01」のヘッダに埋め込んだ完成図です

Continue Reading »

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。