SVGボタンに様々なエフェクトを実装できる「Distorted Button Effects」
歪み・振動・波紋とSVGならではのアニメーションを実装できるエフェクトセット「Distorted Button Effects with SVG Filters」のご紹介。
【CSS】スターウォーズのイントロを表現できるライブラリ「starwarsintro.css」
スターウォーズでおなじみのスクロールテキストを実装することができる軽量なCSSライブラリ「starwarsintro.css」の紹介です。
有名な企業・サービスのロゴをダウンロードできる「Instant Logo Search」
様々なサービスや企業のロゴを検索・ダウンロード(PNG・SVG)できるWebサービス「Instant Logo Search」のご紹介。
【CSS】フォントサイズの単位を相対比較できる「PXtoEM.com」
ベースになるフォントサイズを指定すると、px・em・%・ptと単位ごとに比較一覧することができるWebサービス「PXtoEM.com」のご紹介。
インストールしてるフォントを一覧表示できる「wordmark.it」
PCにインストールしているフォントを一覧表示できるWebサービス「wordmark.it」の紹介。特定のテキストをパッと一覧で比較したい時などに便利。
レスポンシブ対応の画像を生成してくれる「Responsive Image Breakpoints Generator」
レスポンシブデザイン制作で役に立ちそうなブレイクポイント毎に画像を生成してくれるサービス「Responsive Image Breakpoints Generator」のご紹介。
様々なホバーエフェクトを実装できる「imagehover.css」
多くのサイトでよくみられる画像をマウスオーバーさせた時のエフェクトが40種以上も用意されているCSSで作れられたエフェクト集「imagehover.css」を紹介します。
スマホUIのアニメーションを確認できるサイト「appealing」
スマホアプリのUIをアニメーションで見ることができるギャラリーサイト「appealing」の紹介。カテゴライズされているので見たいアクションの動きをパッと見ることができます。
レスポンシブのチェックに役立つサービス「Resizer」
Googleが「Resizer」なるサービスを公開したので備忘録。ブラウザ・スマホの画面サイズでどうサイトが表示されるかをチェックしたい時に最適なサービスです。
Facebookのフリーデザインリソース「Design Resources」
Facebookのデザイナーによって制作されたモックアップとして使えるフリーデザインリソースのご紹介。UIやデバイスの素材が豊富に揃っています。
PICKUP
