モックアップ素材は多く普及しており、使用している方も多いはず。デザイナーにとって重宝できるモックアップ素材ですが、解像度を気にしなくてはならなかったり、新機種が発表されたタイミングなど、中身の入れ替えが面倒な時も。そんなシーンで役立つ、CSSのみを使用してつくられた「Devices.css」を紹介していきたいと思います。

機種も多く収録されており、知っておくと便利に活用することができそうです。

詳しくは以下

CSSで作成されているとは思えないほどのクオリティの高さ。既にビジュアルが発表されている未発売の最新機種まで網羅されているのは非常に嬉しいポイントです。iPhoneやAndroidの他にApple WatchやMacProなど幅広いデバイスも作成されており、必要とされるモックアップがほとんど揃えられています。

使用することで時間短縮もできるかもしれませんね。解像度を気にせず、気軽にモックアップ内の画像の入れ替えを行いたい方にはおすすめのツールなので、ぜひチェックしてみて下さい。

Devices.css – Modern devices in pure CSS