Orbit

Author: Colorlib

Updated: October 2026 · v3.0.0

Credits: Images from Unsplash

Orbit is a personal portfolio and resume template for developers and designers, built on Bootstrap 5, with a clean and minimal look. The layout is responsive and mobile-ready and works in all popular web browsers. It is a one-page template: everything is on the home page, and the sticky menu scrolls to each section.

The page has a full-screen hero with a parallax photo, a bio with skill bars, a filterable portfolio with a lightbox, services, a resume with work experience and education, client testimonials, a latest writing section and a contact section with a working contact form. Sections animate in as you scroll.

What’s new in 3.0

• Bootstrap 5.3.8 (the 2020 release used Bootstrap 4.5.2), compiled from Sass together with the theme into one minified stylesheet, and plain JavaScript with no jQuery. PhotoSwipe 5 replaces Fancybox for the portfolio lightbox, Jarallax replaces Stellar for the hero parallax, and small built-in modules run the portfolio filter with a CSS-grid masonry layout, the scroll reveals, the mobile menu, the menu highlight and the contact form in place of Isotope, AOS and Bootstrap’s scripts. Lucide SVG icons replace the IcoMoon font and an icon font pack, and a small subset of Font Awesome 7 Brands draws the social logos. npm run build (Dart Sass and esbuild) compiles one minified stylesheet and one script.
• Lighter page: it went from 2.8 MB and 38 requests to 768 KB and 26 requests. Photos have AVIF versions with the JPEG as the fallback, real dimensions and lazy loading below the first screen, the hero photo is now 2560 px wide (it was 1610 px), and the full-screen preloader that hid the page until the scripts had loaded is gone, as is a request for an icon stylesheet that did not exist. The download is now 2.1 MB (it was 3.2 MB).
• No third-party requests: Nunito is self-hosted, the icons are local SVGs, and an analytics snippet stays commented out until you add your own ID. Before, the page loaded its fonts from an external font service.
• Working contact form: it sends through php/send-email.php, with validation, a spam trap and an in-page message. Before, the form had no action and no field names, so it sent nothing.
• Accessibility: a skip link, a main landmark, visible focus outlines (they were removed), submenus that open from the keyboard, a mobile menu dialog that keeps focus inside and closes with Esc, portfolio filters as buttons, named skill bars and social links, real image descriptions and WCAG AA text contrast, with all text at 5.8:1 or better: a darker green for text, links and badges, dark text on the green buttons and skill labels, darker greys and a denser overlay that keeps the hero text and menu readable over the photo.
• Fixed: the bio photo’s dot pattern made the page wider than the screen on phones and tablets (497 px at 390 px, 851 px at 768 px), so it scrolled sideways; it no longer does. Menu items, the Download CV button, footer lists and blog entries that pointed to “#” now go to sections of the page, the phone links work, and typos are corrected. The page has a meta description, Open Graph tags and Person structured data.
• New demo content: developer copy in place of placeholder text, fictional employers, school and clients, four distinct testimonials, portfolio titles and categories that match the photos, and a latest writing section. Photos that showed brand logos or makers’ names are replaced with Unsplash photos.