{"id":205917,"date":"2026-10-30T16:50:11","date_gmt":"2026-10-30T16:50:11","guid":{"rendered":"https:\/\/colorlib.com\/wp\/?post_type=portfolio&#038;p=205917"},"modified":"2026-10-30T16:57:18","modified_gmt":"2026-10-30T16:57:18","slug":"mosaic","status":"publish","type":"portfolio","link":"https:\/\/colorlib.com\/wp\/template\/mosaic\/","title":{"rendered":"Mosaic"},"content":{"rendered":"<div class=\"wpb-content-wrapper\" id=\"wpb-content-root\">[vc_row][vc_column][vc_column_text]<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter template-img wp-image-388783 size-full\" src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/mosaic-3.0.0.jpg\" alt=\"Mosaic website template\" width=\"2400\" height=\"1892\" srcset=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/mosaic-3.0.0.jpg 2400w, https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/mosaic-3.0.0-338x266.jpg 338w, https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/mosaic-3.0.0-1024x807.jpg 1024w, https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/mosaic-3.0.0-768x605.jpg 768w, https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/mosaic-3.0.0-1536x1211.jpg 1536w, https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/mosaic-3.0.0-2048x1615.jpg 2048w, https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/mosaic-3.0.0-353x278.jpg 353w\" sizes=\"auto, (max-width: 2400px) 100vw, 2400px\" \/>[\/vc_column_text][\/vc_column][\/vc_row][vc_row][vc_column width=&#8221;1\/3&#8243;]<div class=\"vcex-heading vcex-heading-bottom-border-w-color vcex-module wpex-heading wpex-text-2xl wpex-border-b-2 wpex-border-solid wpex-border-main\"><span class=\"vcex-heading-inner wpex-inline-block wpex-relative wpex-pb-5 wpex-border-b-2 wpex-border-solid wpex-border-accent\">Template Details<\/span><\/div>[vc_column_text css=&#8221;.vc_custom_1548565763260{margin-top: 20px !important;}&#8221;]<strong>Author:<\/strong> Colorlib<\/p>\n<p><strong>Updated:<\/strong> October 2026 \u00b7 v3.0.0<\/p>\n<p><strong>Credits: <\/strong>Images from\u00a0Unsplash[\/vc_column_text][\/vc_column][vc_column width=&#8221;2\/3&#8243;]<div class=\"vcex-heading vcex-heading-bottom-border-w-color vcex-module wpex-heading wpex-text-2xl wpex-border-b-2 wpex-border-solid wpex-border-main\"><span class=\"vcex-heading-inner wpex-inline-block wpex-relative wpex-pb-5 wpex-border-b-2 wpex-border-solid wpex-border-accent\">Description<\/span><\/div>[vc_column_text css=&#8221;.vc_custom_1548830209931{margin-top: 20px !important;}&#8221;]Mosaic is a website template for architecture, interior design and construction studios, built on Bootstrap 5. The layout is responsive and works in all popular web browsers. It comes with eight pages: home, about, project, services, team, blog, blog post and contact.<\/p>\n<p>The home page opens with a two-slide hero, then an about section, animated counters, a work-flow and services block, a project grid that filters between interior and exterior work, a testimonial slider, the team, recent blog posts and a client slider. The project page opens each photo in a lightbox, the blog has a sidebar and a post page with comments, and the contact page has a working form and a click-to-load map. Mosaic gives you a ready-made site to present your studio and its projects.<\/p>\n<h3>What&#8217;s new in 3.0<\/h3>\n<ul>\n<li>Bootstrap 5.3.8 (the earlier release used Bootstrap 4.1 and jQuery), compiled from Sass with the original Bootstrap 4 proportions, and plain JavaScript with no jQuery. Swiper 14 replaces Owl Carousel, PhotoSwipe replaces Magnific Popup, Jarallax replaces Stellar and small built-in modules replace the scroll animations and counters. npm run build (Dart Sass and esbuild) compiles the stylesheets and one script.<\/li>\n<li>Lighter pages: all eight pages together went from 19.9 MB and 378 requests to 7.9 MB and 239 requests (the home page from 3.6 MB to 1.8 MB). Every photo has an AVIF version with the JPEG as the fallback, real dimensions and lazy loading below the first screens, and the home page preloads its hero photo.<\/li>\n<li>No third-party requests: Poppins is self-hosted, the Ionicons, icomoon and Flaticon icon fonts are replaced by Lucide SVG icons and a small social-logo subset (the Twitter bird is now the X logo), the Google Maps script is replaced by a map that loads only after a click, and a Google Analytics 4 snippet stays commented out until you add your own ID. Before, every page loaded Google Fonts and the Maps API.<\/li>\n<li>Working forms: the contact form, the blog comment form and the newsletter box on every page now send through PHP handlers with validation, a spam trap and an in-page message. Before, none had field names or an action, so nothing could be sent.<\/li>\n<li>Accessibility: a skip link and a main landmark on every page, one h1 per page, labelled form fields, names on icon-only links, visible focus rings, reduced-motion support and WCAG AA text contrast, with darker greys for meta text, section introductions and category counts.<\/li>\n<li>Fixed: the Interior and Exterior links above the projects now filter the grid (they did nothing), the contact page no longer leaves a section unclosed, footer, blog and sidebar links that pointed to # go to real pages, the home page has one h1 instead of two, and a missing script file that returned a 404 on every page is gone.<\/li>\n<li>Demo content: new Unsplash photos for the heroes, projects and blog, initials avatars in place of portraits, fictional names, address, phone and email, and architecture copy in place of placeholder text.<\/li>\n<\/ul>\n[\/vc_column_text][\/vc_column][\/vc_row][vc_row][vc_column width=&#8221;1\/3&#8243;] [vc_btn title=&#8221;Preview&#8221; style=&#8221;flat&#8221; color=&#8221;purple&#8221; i_icon_fontawesome=&#8221;fa fa-eye&#8221; add_icon=&#8221;true&#8221; css=&#8221;.vc_custom_1548565781438{margin-left: 10px !important;}&#8221; link=&#8221;url:https%3A%2F%2Fpreview.colorlib.com%2F%23mosaic||target:%20_blank|&#8221;][\/vc_column][vc_column width=&#8221;2\/3&#8243;][\/vc_column][\/vc_row]\n<\/div>","protected":false},"excerpt":{"rendered":"<p>Mosaic is a website template for architecture and interior design studios, with a two-slide hero, a filterable project grid with a lightbox, team and testimonial sections, a blog and a working contact form.<\/p>\n","protected":false},"author":697,"featured_media":388783,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"_yoast_wpseo_focuskw":"","_yoast_wpseo_title":"%%title%% - Free Architecture Portfolio Website Template %%currentyear%% %%sep%% %%sitename%%","_yoast_wpseo_metadesc":"Mosaic is the number one free architecture portfolio website template for agencies and professional individuals to create an impressive online presence.","footnotes":"","colorlib_dwn":"8822"},"portfolio_tag":[6148],"portfolio_category":[6286,5967,6591],"class_list":["type-portfolio","status-publish","hentry","entry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.8 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Mosaic - Free Architecture Portfolio Website Template 2026 - Colorlib<\/title>\n<meta name=\"description\" content=\"Mosaic is the number one free architecture portfolio website template for agencies and professional individuals to create an impressive online presence.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/colorlib.com\/wp\/template\/mosaic\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Mosaic - Free Architecture Portfolio Website Template 2026 - Colorlib\" \/>\n<meta property=\"og:description\" content=\"Mosaic is the number one free architecture portfolio website template for agencies and professional individuals to create an impressive online presence.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/colorlib.com\/wp\/template\/mosaic\/\" \/>\n<meta property=\"og:site_name\" content=\"Colorlib\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/colorlib\" \/>\n<meta property=\"article:modified_time\" content=\"2026-10-30T16:57:18+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/mosaic-3.0.0.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"2400\" \/>\n\t<meta property=\"og:image:height\" content=\"1892\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@colorlib\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/template\\\/mosaic\\\/\",\"url\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/template\\\/mosaic\\\/\",\"name\":\"Mosaic - Free Architecture Portfolio Website Template 2026 - Colorlib\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/template\\\/mosaic\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/template\\\/mosaic\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/wp-content\\\/uploads\\\/sites\\\/2\\\/mosaic-3.0.0.jpg\",\"datePublished\":\"2026-10-30T16:50:11+00:00\",\"dateModified\":\"2026-10-30T16:57:18+00:00\",\"description\":\"Mosaic is the number one free architecture portfolio website template for agencies and professional individuals to create an impressive online presence.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/template\\\/mosaic\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/colorlib.com\\\/wp\\\/template\\\/mosaic\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/template\\\/mosaic\\\/#primaryimage\",\"url\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/wp-content\\\/uploads\\\/sites\\\/2\\\/mosaic-3.0.0.jpg\",\"contentUrl\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/wp-content\\\/uploads\\\/sites\\\/2\\\/mosaic-3.0.0.jpg\",\"width\":2400,\"height\":1892,\"caption\":\"Mosaic website template\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/template\\\/mosaic\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Architecture Website Templates\",\"item\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/cat\\\/architects\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Mosaic\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/#website\",\"url\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/\",\"name\":\"Colorlib\",\"description\":\"WordPress tutorials, theme reviews, and web design inspiration. Free themes and 1,000+ HTML templates from Colorlib.\",\"publisher\":{\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/#organization\",\"name\":\"Colorlib\",\"url\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/wp-content\\\/uploads\\\/sites\\\/2\\\/colorlib-logo-top-1.png\",\"contentUrl\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/wp-content\\\/uploads\\\/sites\\\/2\\\/colorlib-logo-top-1.png\",\"width\":800,\"height\":400,\"caption\":\"Colorlib\"},\"image\":{\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/colorlib\",\"https:\\\/\\\/x.com\\\/colorlib\",\"https:\\\/\\\/www.instagram.com\\\/colorlib\\\/\",\"https:\\\/\\\/www.linkedin.com\\\/company\\\/colorlib\",\"https:\\\/\\\/youtube.com\\\/c\\\/Colorlib\",\"https:\\\/\\\/github.com\\\/colorlibhq\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Mosaic - Free Architecture Portfolio Website Template 2026 - Colorlib","description":"Mosaic is the number one free architecture portfolio website template for agencies and professional individuals to create an impressive online presence.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/colorlib.com\/wp\/template\/mosaic\/","og_locale":"en_US","og_type":"article","og_title":"Mosaic - Free Architecture Portfolio Website Template 2026 - Colorlib","og_description":"Mosaic is the number one free architecture portfolio website template for agencies and professional individuals to create an impressive online presence.","og_url":"https:\/\/colorlib.com\/wp\/template\/mosaic\/","og_site_name":"Colorlib","article_publisher":"https:\/\/www.facebook.com\/colorlib","article_modified_time":"2026-10-30T16:57:18+00:00","og_image":[{"width":2400,"height":1892,"url":"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/mosaic-3.0.0.jpg","type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_site":"@colorlib","twitter_misc":{"Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/colorlib.com\/wp\/template\/mosaic\/","url":"https:\/\/colorlib.com\/wp\/template\/mosaic\/","name":"Mosaic - Free Architecture Portfolio Website Template 2026 - Colorlib","isPartOf":{"@id":"https:\/\/colorlib.com\/wp\/#website"},"primaryImageOfPage":{"@id":"https:\/\/colorlib.com\/wp\/template\/mosaic\/#primaryimage"},"image":{"@id":"https:\/\/colorlib.com\/wp\/template\/mosaic\/#primaryimage"},"thumbnailUrl":"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/mosaic-3.0.0.jpg","datePublished":"2026-10-30T16:50:11+00:00","dateModified":"2026-10-30T16:57:18+00:00","description":"Mosaic is the number one free architecture portfolio website template for agencies and professional individuals to create an impressive online presence.","breadcrumb":{"@id":"https:\/\/colorlib.com\/wp\/template\/mosaic\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/colorlib.com\/wp\/template\/mosaic\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/colorlib.com\/wp\/template\/mosaic\/#primaryimage","url":"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/mosaic-3.0.0.jpg","contentUrl":"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/mosaic-3.0.0.jpg","width":2400,"height":1892,"caption":"Mosaic website template"},{"@type":"BreadcrumbList","@id":"https:\/\/colorlib.com\/wp\/template\/mosaic\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/colorlib.com\/wp\/"},{"@type":"ListItem","position":2,"name":"Architecture Website Templates","item":"https:\/\/colorlib.com\/wp\/cat\/architects\/"},{"@type":"ListItem","position":3,"name":"Mosaic"}]},{"@type":"WebSite","@id":"https:\/\/colorlib.com\/wp\/#website","url":"https:\/\/colorlib.com\/wp\/","name":"Colorlib","description":"WordPress tutorials, theme reviews, and web design inspiration. Free themes and 1,000+ HTML templates from Colorlib.","publisher":{"@id":"https:\/\/colorlib.com\/wp\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/colorlib.com\/wp\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/colorlib.com\/wp\/#organization","name":"Colorlib","url":"https:\/\/colorlib.com\/wp\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/colorlib.com\/wp\/#\/schema\/logo\/image\/","url":"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/colorlib-logo-top-1.png","contentUrl":"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/colorlib-logo-top-1.png","width":800,"height":400,"caption":"Colorlib"},"image":{"@id":"https:\/\/colorlib.com\/wp\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/colorlib","https:\/\/x.com\/colorlib","https:\/\/www.instagram.com\/colorlib\/","https:\/\/www.linkedin.com\/company\/colorlib","https:\/\/youtube.com\/c\/Colorlib","https:\/\/github.com\/colorlibhq"]}]}},"_links":{"self":[{"href":"https:\/\/colorlib.com\/wp\/wp-json\/wp\/v2\/portfolio\/205917","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/colorlib.com\/wp\/wp-json\/wp\/v2\/portfolio"}],"about":[{"href":"https:\/\/colorlib.com\/wp\/wp-json\/wp\/v2\/types\/portfolio"}],"author":[{"embeddable":true,"href":"https:\/\/colorlib.com\/wp\/wp-json\/wp\/v2\/users\/697"}],"replies":[{"embeddable":true,"href":"https:\/\/colorlib.com\/wp\/wp-json\/wp\/v2\/comments?post=205917"}],"version-history":[{"count":6,"href":"https:\/\/colorlib.com\/wp\/wp-json\/wp\/v2\/portfolio\/205917\/revisions"}],"predecessor-version":[{"id":388800,"href":"https:\/\/colorlib.com\/wp\/wp-json\/wp\/v2\/portfolio\/205917\/revisions\/388800"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/colorlib.com\/wp\/wp-json\/wp\/v2\/media\/388783"}],"wp:attachment":[{"href":"https:\/\/colorlib.com\/wp\/wp-json\/wp\/v2\/media?parent=205917"}],"wp:term":[{"taxonomy":"portfolio_tag","embeddable":true,"href":"https:\/\/colorlib.com\/wp\/wp-json\/wp\/v2\/portfolio_tag?post=205917"},{"taxonomy":"portfolio_category","embeddable":true,"href":"https:\/\/colorlib.com\/wp\/wp-json\/wp\/v2\/portfolio_category?post=205917"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}