Construction Demo: Included Pages & How to Customize It

The Construction demo of Canvas is built for general contractors, builders, and trade companies that need a confident web presence to showcase projects, services, and company credentials. It ships with twelve ready to use pages covering the home view, about, blog, careers, contact, investor relations, services, four portfolio layouts, and a custom icon set, so a contractor can launch a full site with minimal extra build work.

Design wise, the demo leans into a practical, no nonsense feel that suits the industry: a stretched layout, a compact header, and a warm orange accent (#F18052) used across CTAs, headings, and hover states. Typography pairs Roboto with Source Sans Pro for clean, highly readable body copy, while full width sections, project grids, and structured service lists make it easy to highlight equipment fleets, completed builds, safety records, and team expertise.

Open the live preview

What's included

Page	Description
demo-construction.html	The Construction landing page introduces the company with a strong hero, service highlights, featured projects, and key statistics to build credibility at a glance.
demo-construction-about-us.html	About Us shares the company's story, mission, team, and track record to help visitors trust the contractor behind the work.
demo-construction-blog.html	A Construction Blog and News index for posting project updates, industry insights, company announcements, and thought leadership articles.
demo-construction-careers.html	The Careers page lists open positions, benefits, and the application process to recruit skilled tradespeople, engineers, and office staff.
demo-construction-contact.html	Contact Us provides office locations, phone numbers, a quote request form, and a map so prospects and clients can quickly reach the right team.
demo-construction-icons.html	A reference page for the Construction font icon set, giving designers an at a glance view of every niche specific glyph available in the build.
demo-construction-investors.html	The Investors page is tailored for shareholders and stakeholders, covering financial highlights, reports, governance, and investor contact details.
demo-construction-projects-2.html	A two column Construction Projects Portfolio layout for showcasing completed builds in a clean, evenly spaced grid.
demo-construction-projects-3.html	A three column Construction Projects Portfolio layout that fits more projects per row while keeping images and descriptions prominent.
demo-construction-projects-5.html	A masonry style five column Construction Projects Portfolio designed for visually rich galleries with mixed project image sizes.
demo-construction-projects.html	A default Construction Projects Portfolio listing that combines filters and project summaries for browsing the full body of work.
demo-construction-services.html	Construction Services and Building Experts outlines the company's specialties, from pre construction planning to commercial builds and renovations.

The demo's own styles live in demos/construction/construction.css. Shared framework styles come from style.css and css/font-icons.css.