Overview
Truiall – Personal Portfolio HTML Template
If you are a designer, developer, photographer, writer, freelancer, or a small creative studio looking for a place to show your work, Truiall is built for you. It is a personal portfolio HTML template made around one job: putting your projects in front of the people who might hire you, and making it obvious how to get in touch.
Truiall is crafted with a calm, editorial design that keeps the attention on your work rather than on the decoration around it. Whether you present UI/UX case studies, brand identity work, product design, photography, illustration, motion, or development projects, Truiall gives each piece room to breathe and a page of its own to tell the full story.
Every project gets a proper case study page — a client and date bar, a link to the live work, a gallery, and space for the thinking behind it. Projects are grouped into categories that become filter buttons on your portfolio grid, so a visitor looking for one kind of work can find it in a click. Services follow the same pattern, each with its own icon, description and sidebar.
Truiall ships three complete home layouts, three headers and three footers, and you can mix them freely: pick the header and footer on each page, so one site can carry a classic bar on the work pages and a minimal one-page layout on the front. Clean, well-commented code and CSS variables make it easy to change your colours, fonts and spacing in one place.
Built with current tools — Bootstrap 5.3, HTML5, CSS3 and jQuery, with GSAP and Swiper driving the motion. The template is fully responsive and tested from small phones through to large desktop screens.
Features Overview
-
Clean, well-structured code:
Semantic HTML5, organised CSS and commented JavaScript. Open any file and find what you need quickly, with no
page builder or CMS required.
-
Bootstrap 5.3 Framework:
Bootstrap is the most popular HTML, CSS and JS framework for developing responsive, mobile-first projects
on the web.
-
Portfolio and Services pages:
Ready-made portfolio grid, portfolio details, services list and service details pages. Duplicate a page,
swap the content, and your work stays organised as it grows.
-
Filterable portfolio grid:
Category filter buttons let visitors find the kind of work they are looking for in a single click.
-
Contact form included:
A styled contact form with client-side validation is ready on the contact page. Connect it to the mail
handler or form service of your choice.
-
Easy to customise:
Colours, fonts and key spacing are controlled with CSS variables, so a full rebrand takes minutes, not hours.
-
Detailed documentation:
Step-by-step documentation covers the file structure, how to edit each section, how to change colours and
fonts, and how to set up the contact form.
-
Touch friendly:
Sliders, galleries and menus are all built for touch, so browsing feels right on a phone or tablet.
-
Ready to upload:
Edit the placeholder content, upload the files to any hosting, and your site is live. No database, no
installation and no server-side setup needed.
-
Responsive & retina ready:
How your site looks on a phone matters more than ever, so Truiall was designed to look right on mobile,
desktop and retina screens alike.
-
Cross-browser compatibility:
Tested in the current versions of Chrome, Firefox, Safari and Edge.
-
SEO friendly, fast loading:
Semantic markup, clear heading structure and lightweight assets help your pages load quickly and read well
for search engines.
-
Free updates and user support:
Each purchase guarantees access to future template updates at no extra cost. You also get six months of
user support, with the option of extending this period should you wish.
Full Features List
- Personal portfolio HTML template
- Based on Bootstrap 5.3
- 100% responsive
- Valid HTML5 / CSS3
- No coding framework or CMS needed
- 3 home pages
- 3 header variations
- 3 footer variations
- Portfolio grid page with category filter
- Portfolio details page: client, date, live link and gallery
- Services page with per-service icons
- Service details page with sidebar
- About page
- Blog grid and blog details pages
- Contact page with styled form and validation
- Offcanvas panel with gallery, contact and social blocks
- 404 page
- Breadcrumb and call-to-action sections
- CSS variables for colours and fonts
- SEO friendly, semantic markup
- GSAP and Swiper powered animation
- Smooth scrolling with Lenis
- Phosphor Icons included
- Google Fonts
- Cross-browser compatible
- Well-commented, organised code
- Detailed documentation
- Free updates
- Professional support
Sources and Credits
Fonts Used
Image Credits
All images shown in the live preview are used for demonstration only and are not included in the download package.
