CSSでスマートフォンなどデバイスのモックアップを実装できる「Devices.css」

　
スマートフォンやタブレット・PCまで様々なデバイスをCSSで表現したライブラリ「Devices.css」を紹介します。iPhone・iPad・AppleWatch・MacBookからGoogle Pixel・Surfaceまで簡単に実装することができます。

Devices.css


iPhoneXでは筐体はCSS、スクリーンは動画を埋め込んで再現しています。アプリの紹介や操作フローなど動画と組み合わせれば効果的に使えそうです。
Devices.css


RELATED POSTS
  • 500種類以上のアイコンフォントとCSSのツールキット「Fontisto」
  • アップロードしたイメージからカラーを抽出するツール「Pictones」
  • CSSで実装するローディングアニメーション「Single Element CSS Spinners」
  • さまざまなスタイルのCSSボタンをコレクションした「Buttons」
  • ブロックのアニメーションエフェクトが美しい「Block Reveal Effects」
  • 複数のレイヤーを活かしたきれいなエフェクト「Multi-Layer Page Reveal Effects」
PICKUP
POPULAR POSTS
  • 漢字が使えるおすすめの日本語フリーフォントまとめ
  • 長いURLを短くするオススメの短縮URLサービス
  • CSSグラデーションの作成に役立つジェネレーター・Webサービスまとめ
  • フォントを調べる時に役に立つサービス・サイトまとめ
  • CSSで簡単に作れるおしゃれな見出しデザイン20選
RECENT POSTS
  • イメージワードを選択するだけでフリーフォントを簡単に検索できる「モジザイ」
  • アイコンフォント「FontAwesome」の使い方
  • 漢字が使えるおすすめの日本語フリーフォントまとめ
  • hulu (フールー)で観れるおすすめの海外ドラマ・国内ドラマ【2019年10月版】
  • プライス・値段表示などに使えそうな英数字フォント13選
TAG LIST

  • Webサービス

    87

  • CSS

    58

  • 素材

    34

  • jQuery

    34

  • エフェクト

    31

  • フリー

    28

  • ジェネレーター

    26

MORE