Back to templates

Template details

Cocoon

Free multi-page Bootstrap 4 agency website template with left-side navigation, lightbox gallery, portfolio filter, and contact form.

About this template

Cocoon is a free, multi-page Bootstrap 4 agency website template from ThemeWagon, built by Colorlib, that gives creative agencies, photographers, and startups a responsive site with left-side navigation, a lightbox gallery, and a portfolio filter.

What is Cocoon?

Cocoon is a static HTML/CSS/JS website template built on Bootstrap 4, FontAwesome, jQuery v2.2.4, Popper.js, and Slick Slider. It takes your content — images, text, portfolio items, a map address, and a contact form — and produces a complete multi-page agency website with a blog and contact page. The template was created by Colorlib and distributed free on ThemeWagon, and it includes 7 HTML files, 8 CSS files, 13 JavaScript files, 1 PHP file, SCSS source files, and documentation.

Key Features

  • Multi-page layout — Seven ready-to-use HTML pages let visitors move through a homepage, blog, portfolio, and contact sections without a single-page app.
  • Left-side navigation — The fixed sidebar menu positions social media icons at the bottom and keeps primary links visible on every page.
  • Lightbox gallery — Images open in a smooth lightbox with slide navigation, suited to photography and portfolio showcases.
  • Portfolio filter — Visitors can sort portfolio items by category to narrow down what they want to see.
  • Animated counter — Number counters animate on scroll, useful for displaying stats like projects completed or clients served.
  • Instagram feed — A blog page section pulls an Instagram feed so posts stay visually fresh.
  • Custom Google Maps — The contact page embeds a custom Google Map to show the company location, paired with a contact form and address text.
  • Slick slider and on-hover effects — A jQuery Slick slider handles carousels, and hover effects add interactivity to cards and images.

Who is it for?

  • Creative agencies — Showcase team services, portfolio work, and client testimonials in a professional multi-page layout.
  • Photographers — Use the lightbox gallery and portfolio filter to present image collections cleanly.
  • Startups — Launch a multipurpose site with blog, contact, and map features without writing code from scratch.
  • Freelance designers — Quickly spin up a client-ready website using the included documentation and SCSS files for customization.

What can you do with it?

  • Agency owners: Build a full service page, add an animated stats counter, and collect leads through the built-in contact form.
  • Photographers: Arrange photos in a filterable portfolio and lightbox so visitors can browse images smoothly.
  • Startup teams: Publish a blog with an Instagram feed and embed a Google Map so customers can find the office.
  • Developers: Customize the template using SCSS source files and the included documentation, then deploy the static HTML anywhere.

Pricing

Cocoon is offered free under an open-source license, allowing use in commercial projects with lifetime free updates. No paid tier is mentioned on the page.

Alternatives

  • Baikal — a multipurpose Bootstrap 4 template from ThemeWagon mentioned alongside Cocoon.
  • Posh — a premium Bootstrap 5 creative portfolio website template from the same marketplace.

FAQ

Is Cocoon free to use?

Yes, Cocoon is a free template released under an open-source license. It can be used in commercial projects and receives lifetime free updates, as stated on the ThemeWagon download page.

What Bootstrap version does Cocoon use?

Cocoon is built on Bootstrap 4, with FontAwesome icons, jQuery v2.2.4, Popper.js, and the Slick slider library. It also includes SCSS files for styling customization.

Does Cocoon include a contact form?

The contact page includes a contact form placed alongside text and an address block, plus a custom Google Map so visitors can locate the business.

How many HTML files come with Cocoon?

The template package includes 7 HTML files, along with 8 CSS files, 13 JavaScript files, 1 PHP file, SCSS source files, documentation, and demo images.

In which browsers does Cocoon work?

Cocoon is compatible with Chrome, Edge, Firefox, Opera, Safari, and mobile browsers, based on the compatibility list reported on the ThemeWagon product page.

screenshot of Cocoon on template0.com