無料のおすすめ最新HTML5テンプレート厳選45個まとめ【2020年版】

wemeet-free-template

 

スマートフォンからウェブサイトを閲覧するひとが増えたことで、あらゆる端末に対応するレスポンシブなWebサイトが主流となっています。

 

しかし、「HTML5でWebサイトをゼロから作成するのはちょっと、。」というときは、HTML5でできたテンプレートを活用してみましょう。

 

この記事では、無料ダウンロードできるオススメのHTML5テンプレートをまとめてご紹介します。

 

2020年に公開されたものを中心に最新テンプレートを揃えています。Bootstrapフレームワークを利用しているものも多く、手軽にカスタマイズできる点もポイント。あらゆる業種にマッチする、お好みの無料HTMLテンプレートを探してみましょう。

 

 

商用利用もできる無料HTMLテンプレートまとめ

Switch

あらゆるデバイスでの表示に対応するランディングページ向けテンプレート。ダークモード切り替えも可能で、イラストを背景として効果的に活用しています。

switch

 

 

Solid

アニメーション付きで展開するヒーローイメージが印象的だった、ダーク系のランディングページ向けHTMLテンプレート。

solid

 

 

Hook

Shorthand CSSをフレームワークに、コピペで利用できるコンテンツ(ヒーロー、金額表、カルーセル、ニュースレター購読、ブログなど)がそれぞれ用意されています。SaaSをつかったカスタマイズしやすい仕様。

hook-landing-template

 

 

Kross

クリエイティブで洗練された個人向けポートフォリオ用HTML5テンプレート。印象に残るグラフィックはもちろん、ミニマルで使いやすいインターフェースなどオススメのアイテム。

kross_20free_20psd

 

 

BLK Design System

Bootstrapをベースに、70を超えるコンポーネントが追加されたデザインシステム。5色のカラーテーマも用意され、SaaSでのカスタマイズも柔軟に行うことができます。Bootstrapでダーク系デザインを作成したいときに。

opt_blk_thumbnail

 

 

Argon

デザイン性に優れたウェブサイトを、用意されたBootstrap対応コンポーネントから選んでいくだけで作成できる、便利すぎるHTMLコンポーネント集。デモページはもちろん、用意された素材で自分だけのデザインを作成してみましょう。

opt_argon_thumbnail

 

 

Ellie

サービス開始までのお知らせ向けランディングページを想定したHTML5テンプレート。

ellie

 

 

Apart

黒を基調としたダーク系HTMLテンプレートは、スマートフォン向けアプリやサービスの紹介に便利で、手軽にランディングページを作成できます。

laurel

 

 

Venus

スマートフォン用アプリのプロモーション、ランディングページ向けテンプレートで、背景と一体感のあるモックアップデザインは、2020年注目スタイルのひとつ。

venus

 

 

Marshmallow

SVGを活用した波型ウェーブ上の仕切りラインや、素敵なグラフィック、イラストなどデザイン性の高いテンプレート。MITライセンスで、モバイルフレンドリー、Bootstrap4対応。

marshmallow

 

 

Crystal – Free Multipurpose Bootstrap 4 Template

4つのテーマが用意され、それぞれ画像スライダーやパララックス、動画をつかったヒーロー背景など、どれも注目を集めるのに最適なレイアウトが揃います。

crystal-pro-ud

 

 

Essence – Free Bootstrap 4 One Page Template

プロフェッショナルな見た目で、幅広い用途に利用できるランディングページ向けテンプレート。Bootstrap4をフレームワークに、より魅力的なデザイン、最新Webテクを追加ています。

essence-free-onepage-bootstrap4

 

 

April

ウェブサイトを閲覧したひとの注目を集める、マイクロインタラクションを効果的に利用したランディングページ向けテンプレート。

april

 

 

Interior – Free Interior Design And Decoration Template

インテリアや建築の分野のニーズを想定したコンテンツは、Bootstrap4をベースとして作成されているのでカスタマイズも自在。CSS3アニメーションを追加し、より心地よい動きが演出できます。

interior-design-template

 

 

Furnish – Free Furniture Website Template

家具やインテリア、デコレーションなどの販売向けウェブサイトのHTML5テンプレート。Bootstrap4対応でレスポンシブ。

furnish-banner

 

 

Snipp

パステルカラーの美しいグラデーション、配色が特長のビジネス向けHTMLテンプレート。スクロールに応じたアニメーションや使い勝手の良いレイアウトにも注目。

snipp-free-template

 

 

Ethos.

デザイン性抜群の個人ポートフォリオ向けHTMLテンプレート。ダーク系デザインを基調に、心地よいアニメーションやゆとりのあるレイアウトなど、どれも素敵なものばかり。

ethos-portfolio-template-580x435

 

 

Arizona

デスクトップでは画面を分割したスプリット・レイアウトが特長で、ホームページの他にお問い合わせなど各種ページも同時に収録されています。

arizona-html-template-01

 

 

Sentra

左固定ナビメニューに、ヒーロースライダーなど写真を多用したコンテンツが豊富な、ポートフォリオ向けテンプレート。

sentra

 

 

Earth

各種コンテンツが水平方向に移動、切り替わるユニークなギャラリー向けテンプレート。

earth

 

 

Studio

フルスクリーンで展開するギャラリー用HTMLテンプレート。ホーム以外にも各種ページが用意されており、モバイル表示にも対応したレスポンシブデザイン。

studio

 

 

Nissa

ウェブサイトをはじめて訪れたときの第一印象を大事にした、個人フォトグラファー向けポートフォリオ用HMTLテンプレート。水平方向へのスクロールやフルスクリーンで表示されるナビメニューなどのエフェクト満載。

nissa-free-template

 

 

Simple Landing page

あらゆるサービスやニーズに対応できる、シンプルで使い勝手の良いモダンなHTMLテンプレート。Bootstrapフレームワークをつかっているので、カスタマイズのしやすさもポイント。

simple-landingpage-2-1

 

 

SaaS Application

シンプルでモダンな使いやすいデザインが特長のテンプレート。サービス料金の月払いと年一括払いを選択できる価格表にも注目。

saas-application

 

 

Silon – One Page E-Commerce HTML Template

女性向けアパレルのショッピングサイト用HTMLテンプレートで、細部まで作り込まれたCSSアニメーションなど、ユーザーの注目を引く仕掛けが随所に。

silon-template

 

 

Pentrax – Creative App Landing PSD Template

目を引くSVGアニメーションをヒーローに利用した、2020年らしいトレンディーなHTML5テンプレート。人気のキャラクターイラストの具体的な使い方や、ドロップシャドウの効いたカードレイアウトなど、Web制作の参考にも良いでしょう。

pentrax-creative-app-landing-template-thumb

 

 

Slick – Free Multipurpose Bootstrap 4 Template

Bootstrap4とHTML5をベースとした、使い勝手の良いウェブテンプレート。2つのスタイルが用意されており、サービス紹介から制作実績、金額表、チーム紹介、ブログ、お問い合わせなど一通りのコンテンツが揃います。

slick

 

 

Stack – Free Bootstrap 4 Business Template

2020年人気となっているイラストを全面につかった、シンプルで使いやすいテンプレート。すべてのコンテンツが1ページで完結するペライチなランディングページが欲しいときに。

stack-ud

 

 

Slide

Bootstrap 4フレームワークを元に作成された、シンプルで最小限のデザインのみにしたテンプレート。デモ以外にも10色のカラーテーマが用意されており、SASSファイルで手早くカスタマイズ可能。

slide-800x388

 

 

Prism

Bootstrap4で作成された、オープンソース向けプロジェクトでの活用を想定したテンプレート。コードを表示するなど、プログラミングをわかりやすくしたスタリングが特長。

prism-800x401

 

 

Tivo – Free SaaS App

文字テキストを編集するだけですぐに利用できる高品質なHTMLランディングページ。分かりやすいシンプルなレイアウトは、プレゼンテーションにも最適。

tivo-free-saas-app-landing-page-html-template-cover

 

 

Fusion – Free App, Business, SaaS & Product Landing Page

モバイルアプリやビジネス向けのランディングページで、最新バージョンのBootstrap4で作成されています。Webサイトが手軽にデザインできるだけでなく、一通りのUIコンポーネントもすべて揃います。

fusionbootstrap4template

 

 

Sync – Free Mobile App

モバイルアプリのプロモーション、ランディングページを想定したテンプレート。使いやすいインターフェースや余白たっぷりのミニマルなレイアウトなど、どんな業種にも最適です。

sync-free-mobile-app-landing-page-html-template-cover

 

 

Leno – Free Mobile App

こちらもモバイルアプリの紹介、販売向けのランディングページ。ブランドイメージとマッチしたダーク系のデザインが欲しいときに。

leno-free-mobile-app-landing-page-html-template-cover

 

 

SaaS Subscription

サブスクリプションサービス向けの紹介用ランディングページは、トレンドをうまく取り込んだモダンなデザインが特長。

saas-sub-min

 

 

Online Course

オンライン講座受講にあたって、コースのカリキュラムやよくある質問Q&Aコーナーなど、特化したUIコンポーネントも充実したテンプレート。

online-course-min

 

 

Material – Free Material Design Bootstrap 4 UI Kit

Googleのマテリアルデザインをコンセプトに、Bootstrap4でデザインしたレスポンシブテンプレート。スクロールアニメーションに若干難あり。

material-banner

 

 

Evolo – Free StartUp

スタートアップのサービス紹介を想定したランディングページ。イラストを各コンテンツに利用することで、統一感のあるデザインに。

evolo-free-startup-landing-page-html-template-cover

 

 

Aria – Free Business

ダイナミックなヘッダーやテキストスライダー、ギャラリーのソート機能など多彩な機能が特長のビジネス向けテンプレート。

aria-free-business-landing-page-html-template-cover

 

 

Approach

写真を美しく魅せるポートフォリオ向けテンプレートで、トップページの他にAboutページ、ブログ、サービス紹介、お問い合わせなど複数ページに対応できます。

approach-free-template

 

 

Vanilla – Free Bootstrap 4 Template

Webサイトをイチから作るのが面倒なときに活用したい、不要なものをできる限り取り除いた、ごくごくシンプルBootstrap HTML5テンプレート。

vanilla-bootstrap-4-template

 

 

Corso – Free Training Course

オンラインコースへの登録を促すプロモーションページ。ウェブサイト制作に必要なUIコンポーネントが一式揃っているので、幅広いデザインに利用できます。

corso-free-training-course-landing-page-html-template-cover

 

 

EvnentUp – Free Event And Conference Template

イベントの告知、開催までのカウントダウンを行うランディングページ向けテンプレート。2色のスタイルが用意されています。

eventup

 

 

Bolt – Free Coming Soon Template

カミングスーン用のカウントダウン機能付きページで3つのバリエーションが用意されています。Bootstrap4なので、カスタマイズのしやすさも◎。

bolt-banner

 

 

過去の無料HTML5テンプレートもチェックしよう

 

以下の記事では、今回未紹介のHTMLテンプレートを揃えています。無料ダウンロードできるだけでなく、商用可能なアイテムも数多くまとめているので、こちらも一緒に確認してみると良いでしょう。

 

無料で商用可!Bootstrapでできた高品質なHTMLテンプレート素材25個まとめ

レイアウトで選ぶWebデザイン・HTMLテンプレート40個総まとめ 2018年版

レベル高っ!商用可能な無料HTMLテンプレート200+種類を配布しているサイト Colorlib

あまり知られていないBootstrapスタイルテクニック、小技16個まとめ

 

サムネイル@ : WeMeet – Colorlib