SHARE

クールで個性的!白黒イラストが特徴のWEBサイトデザイン5選

SPIQA DESIGN

2023.11.06

デザイナーのHandaです。
白黒のシンプルなイラストが大好きなので、そんなイラストが使われたクールで個性的なWEBサイトを集めてみました。

クールで個性的なデザインの参考にしてみてください!

白黒イラストが特徴のWEBサイト

TATELab.

公式サイト:https://tate-lab.com/

メインビジュアルのイラストがインパクトのある、五感拡張型クリエイティブ制作室「TATELab. (たてラボ) 」のWEBサイトです。

スクロールを進めていくと顔のイラストが下へ降りていき、顔がアップで表示され…。

個性的なイラストに動きが加わり、どんどんスクロールしたくなります!
白黒以外のカラーを一切使っていないものの、大胆なテキスト配置やイラストの使い方でとても印象的に魅せています。

KACCO DESIGN STUDIO

公式サイト:https://www.kacco.jp/

京都にあるWEB制作会社「KACCO DESIGN STUDIO (カッコデザインスタジオ) 」のWEBサイトです。

アナログ感のある手書き風のイラストが、クールな白黒の配色でも柔らかな印象を与えています。
シンプルな構成とレイアウトでも、イラストが入ることで目が惹かれるアクセントとなっています。
ミニマルなデザインのサイトにぴったりなタッチのイラストで個性的です!

拉麺ししまる

公式サイト:https://shishimaru.agni-inc.com/

愛知県で深夜まで営業しているラーメン屋「拉麺ししまる」のWEBサイトです。

インクブラシで描いたような獅子のイラストと、手書き風のタイポグラフィで個性的なデザインになっています。
「麺」の漢字の中にラーメンをお箸で持ち上げている記号が組み込まれている細かな表現も素敵です。
ロゴやイラストでグッズ展開などもできそうなおしゃれな雰囲気で差別化しています!

WELD SUPPLY CO.

公式サイト:https://weldsupplyco.com/official/

愛知県名古屋市のライフスタイルブランド「WELD SUPPLY CO.」のWEBサイトです。

グリッドデザインの中に綺麗に収まっている線画イラストが印象的なデザインになっています。
かっちりとしたロゴやフォントとは反対に、手書きのゆるさを感じるテキストとイラストのタッチが目立っています。
部屋を上から見たような構図で、ついつい小物などもじっくり見てしまうデザインです!

手書きタッチのイラストはゆるく柔らかな印象を与えますが、周りのデザインや線の細さなどでクールに引き締まって見えます。

みんなの銀行 BaaS

公式サイト:https://baas.minna-no-ginko.com/

デジタル銀行「みんなの銀行」の法人向けBaaS (銀行サービスをインターネットを介して提供するもの) のWEBサイトです。

メインビジュアルだけでなく、いろんなところに絵本のようなゆるいタッチのイラストが使われています。
金融などの堅い印象を、イラストで柔らかに親しみやすく魅せています。
白黒の配色でかっちりとしたデザインの中にサインペンで描いたようなイラストが入ることで、メリハリのある個性的なサイトになっています。

まとめ

今回は個性的な白黒イラストが使われているサイトをまとめてみました!
色数が少ないサイトはシンプルでクールな印象を感じますが、イラストが柔らかさをプラスしていたり、目を惹くアクセントになっていたりと、効果的に使うことでとても魅力的なWEBデザインになります。

個性的なデザインの参考にしてみてください!

※ご紹介させていただいたサイトはデザイン性が高いためピックアップさせていただきました。掲載の取消をご希望の場合はご連絡いただき次第速やかに対応させていただきます。

Webサイト・ホームページ制作なら、スピカデザインにご相談ください。

スピカデザインでは、コーポレートサイト、サービスサイト、採用サイトなど幅広いサイト制作に対応しています。デザインでお客さまの課題を解決するお手伝いをさせていただきます。 まずはお気軽にご相談ください。

スピカデザインに相談する

記事を書いた人

SPIQA DESIGN

スピカナレッジについて

WEB制作・ホームページ制作会社
「スピカデザイン」が運営するメディアです。
WEBのプロが知識をお届けします。

株式会社スピカデザイン 公式X