Solo — Free One-Page Multipurpose Bootstrap 5 Template
Solo is a free one-page multipurpose website template built on Bootstrap 5 and designed in-house by uiCookies. It packs every section a small business, agency or freelancer needs onto a single scroll — hero, about, services, a filterable portfolio, metrics, team, pricing, testimonials, journal and contact — and ships completely jQuery-free. Scrollspy, category filtering, an accessible lightbox, count-up metrics, a pricing toggle, a testimonials slider and form validation are all written in plain vanilla JavaScript.
Key features
- Sticky navbar with scrollspy and smooth in-page scrolling
- Abstract pure-CSS hero visual — no stock photo required
- Six-card services grid with staggered scroll-in reveals
- Portfolio with instant category filtering and a keyboard-accessible lightbox
- Count-up metrics band powered by IntersectionObserver
- Three-tier pricing with a highlighted plan and monthly/annual toggle
- Autoplaying testimonials slider with dots, arrows and hover-pause
- Labelled, validated contact form plus a footer with back-to-top
- Palette and type driven by CSS custom properties for easy restyling
Best for
- Creative agencies and design studios
- Startups launching a one-page site fast
- Freelancers and solo consultants
- Small businesses needing a complete landing page
- Developers wanting a jQuery-free multipurpose base
At a glance
- Bootstrap 5 with no jQuery and no plugin dependencies
- Vanilla JavaScript: scrollspy, filtering, lightbox, count-up, slider, pricing toggle, form validation
- Progressive enhancement: all content is visible with JavaScript disabled
- Accessible: semantic landmarks, ARIA on custom widgets, visible focus, keyboard support, reduced-motion aware
- Palette and type driven by CSS custom properties for one-place restyling
- Bricolage Grotesque / Inter type pairing on a warm paper + cobalt palette
How to use it
Download the ZIP, unzip it, and open index.html — no build step, nothing to install. Edit the text and images, point any forms at your backend or a form service, and deploy the folder to any static host. Colours and fonts live in css/style.css; the interactions are in js/main.js.
Frequently asked questions
Is Solo free to use, including for commercial projects?
Yes. Solo is free for both personal and commercial projects under the standard uiCookies license. The one condition is attribution, and the exact terms are listed on the uiCookies license page. There is no paid tier or locked version — the download is the complete template.
Does Solo use jQuery or any third-party plugins?
No. Solo is completely jQuery-free and ships with no plugin dependencies. Every interaction — the mobile menu, scrollspy, portfolio filtering, the lightbox, count-up metrics, the pricing toggle, the testimonials slider and form validation — is written in plain vanilla JavaScript, one function per feature. The only bundled library is Bootstrap's own JavaScript bundle, which powers the responsive mobile menu.
How do I change Solo's colours and fonts?
The palette and type are defined as CSS custom properties in the :root block at the top of css/style.css, so you can restyle the whole template from one place. Change –accent to swap the cobalt highlight, or adjust the ink, paper and surface variables to reshape the neutrals. Fonts are set with the –font-display and –font-body variables and loaded from Google Fonts in the head.
Will the content still show if JavaScript is disabled?
Yes. Solo is built with progressive enhancement, so all content is fully visible without JavaScript. A small inline script adds a .js class to the page, and only under that class do the scroll-reveal elements start hidden before animating in. With JavaScript off, nothing is stuck at zero opacity and the page reads as a normal static site.
Is Solo accessible and keyboard-friendly?
Accessibility is built in throughout. The page uses semantic landmarks and a skip link, custom widgets carry ARIA attributes, and focus styles stay visible. The lightbox, testimonials slider, portfolio filters and form are all operable by keyboard — the lightbox traps focus and closes on Escape, and the slider responds to arrow keys. All animations respect the visitor's reduced-motion preference.
How does the portfolio filtering and lightbox work?
The portfolio grid filters instantly by category — All, Branding, Web, Product and Motion — with no page reload, using vanilla JavaScript to show and hide items. Clicking any project opens a built-in lightbox with previous and next controls, caption text, and full keyboard support including arrow-key navigation and Escape to close. It is a custom component, so there is no external gallery library to maintain.
Does the contact form actually send messages?
No. Solo is a static front-end template, so the contact form is fully marked up and validated on the client side but has no backend attached. It checks required fields, email format and a minimum message length, then shows a success or error message. To make it send for real, connect it to a form-handling service or your own server-side script.
What's included in the download, and what should I replace before launch?
You get the single-page HTML template with every section, the custom css/style.css design layer, the vanilla js/main.js file, and self-hosted copies of Bootstrap's CSS and JavaScript bundle. The demo images are referenced by local paths in the img folder, so swap in your own optimised photos — keep the width and height attributes and descriptive alt text — and update the demo copy, prices and team details with your own before going live.
