Free travel agency website template

Live demo Download ZIP Build without code GitHub

Edit it by hand: it is one index.html with no build step, so you can open it in any text editor, change the words and photos, and upload it to any static host. Not a coder? Describe your business in one sentence to 8B's AI website builder and it designs a new site for you, with more pages when you need them. Designing is free; publishing with hosting is $9 a month, billed yearly. It also works inside Claude and ChatGPT.

MIT license · Made by 8B, an AI website builder · Plain text: binario-tre.md, data: binario-tre.json

Travel agency website template: first screen on a phone

About this travel agency website template

Travel agency website template: a one-page site for a small group tour operator that sells dated rail journeys. It has a three-stop route, four priced lines, a departures table with seats left, a FAQ and an enquiry form, in olive and cream with an amber accent. It is one HTML file an AI agent can adapt.

At a glance, October 2026. One 84 KB index.html with its CSS and JavaScript inside, 12 sections, 16 Unsplash photos credited in CREDITS.md, Schibsted Grotesk and TikTok Sans from Google Fonts, GSAP 3.13.0 (ScrollTrigger); Lenis 1.3.27 smooth scroll loaded from jsDelivr.

People who type travel agent websites or website for travel agency are often selling fixed departures, not hotel search. This template fits a tour operator, a walking holiday or retreat organiser, or a craft and food trip with local hosts. Four priced lines, seven dated departures and a private hire offer make it a travel agency website for trips that leave on set days.

Give index.html and AGENTS.md to Claude Code, Cursor or Codex. In a vibe coding session, start with the company, the four lines, the three hosts, the seven departures, prices and the office details, then the photos and alt text. The agent must keep the ids, the data-8b-section, data-8b-motion and data-8b-part attributes and the selectors AGENTS.md lists. It must ask for dates, seats, terms and the licence line, never invent them.

Choose it when you sell dated departures at a price per person and want one scrolling page. It has no booking engine, so hotel or flight search needs other software. A product with a model range and a test ride fits the electric moped template better. The weak spot is the opening, which clips a full-screen layer on every scroll update and is the heaviest effect. Without code, 8B designs a new site.

Good for:

Small group tour operator or travel agency with fixed departuresCraft, food or wine experience trips with local hostsRetreat, walking holiday or cultural tour organiserAny service that sells dated departures with seats left and a price per person

Turn the travel agency website template into your site with an AI agent

With an AI coding agent

Files (PowerShell: curl.exe):

curl -LO https://raw.githubusercontent.com/8bsite/travel-agency-website-template/main/index.html
curl -LO https://raw.githubusercontent.com/8bsite/travel-agency-website-template/main/AGENTS.md
curl -LO https://raw.githubusercontent.com/8bsite/travel-agency-website-template/main/LICENSE
curl -LO https://raw.githubusercontent.com/8bsite/travel-agency-website-template/main/CREDITS.md

Prompt for the agent:

Read AGENTS.md, then edit index.html. This is a one-page site for <your tour or travel business: the journeys, stops and local hosts, price per person and what is included, departure dates with seats left, group size, office and how to book>. Replace the company, journeys, hosts, departures, prices, address and contacts first, then the photos and alt text. Keep every id, data-8b-section, data-8b-motion and data-8b-part, and change both --len values with the words. Ask me for any missing fact. Never invent prices, dates, licences, VAT numbers, reviews or contacts.

In a terminal

npx degit 8bsite/travel-agency-website-template my-site

Travel agency website design and motion

Palette

#465016 olive: page ground, nav bar, opening plate, route, hosts, what-is-included section, private hire and footer grounds, and the first ground of the day section#e6dcbf cream: body text on dark grounds, ticket and form surfaces, the filled part of the route rail, cream sleeper bars#1d2209 near-black: journeys and FAQ grounds, text on cream tickets, dark buttons, hard offset shadows, the last ground of the day section#5f6834 lighter olive: route rail, FAQ dividers, and sleeper bars#4a2f14 brown: carriage screen, departures and contact grounds, and the middle ground of the day section#d49a3a amber: filled buttons, window frames, the route marker, entry times in the day section, rules, focus outlines

Fonts

TikTok Sans: display face: wide (140% stretch), uppercase, weight 800 headings, buttons, ticket prices and the footer wordmark
Schibsted Grotesk: body text at weight 400, subheads at 500, small uppercase labels at 700

A fixed bar over ten sections. The opening is two screens: a landscape under a two-line title in an olive plate, then a carriage screen with a rounded window photo and three facts. Below come a rail with three stops, four ticket cards in two columns, three hosts in staggered columns, a sticky window beside three timed entries, a departures table, a ticket with a stub, a two-column FAQ, a tilted private hire band and an enquiry form.

The grounds alternate olive, near-black and brown, and the day section shifts from olive to brown to near-black as you scroll. Ticket surfaces have notched edges and most sit at slight tilts, and bands of skewed sleeper bars run under the opening, above the departures and over the footer.

Every value of this travel agency website design, with the type scale, spacing and the motion rules, is in its DESIGN.md file (Google's format), ready for a coding agent or Stitch.

What is on the travel agency website page

Navigation
Fixed bar: numbered badge and name, six links, Ask for a seat button and a menu button; a menu panel with seven links; hides on scroll down
The bar slides up out of sight after about 24 px of downward scrolling and returns on scroll up or keyboard focus; this keeps running with reduced motion.
Slow trains. Three stops.
Two screens: a full-bleed landscape under a two-line title, intro and buttons, then a carriage screen with a window photo and three facts
On load the landscape settles and the title lines rise, then the photo drifts sideways in a loop; as the carriage screen rises the landscape narrows by clip path into the window photo while the title lines slide apart.
The Tuscan line
A rail with a marker that travels past three stops, each stop opening from behind slats
On scroll a marker travels along the rail past three stops, across on wide screens and down the left edge on narrow ones, filling the rail behind it, and eight slats over each stop fall away as it arrives.
Four lines for 2027
Four ticket cards with photo, stops, description, price and a Dates button
The four tickets start piled in the middle of the top row and deal out to their places as you scroll; on narrow screens each ticket drops from the one above.
Who waits at each stop
Three hosts with a photo of their hands at work, name, role and a quote
The heading glides in from the left, and each host photo frame opens upward from its bottom edge while the image settles from a zoom, once on arrival.
A day on the line
A sticky window that changes its view beside three timed entries, on a ground that turns from olive to brown to dark
The window stays sticky beside three entries; as you scroll, the amber rule under each entry draws across, the ground moves from olive to brown to near-black and the window wipes to the next photo.
Departures 2027
A table of seven 2027 departures with seats left and price, under a band of sleeper bars
The band of sleeper bars above the table slides sideways with scroll and the heading glides in from the left.
One ticket covers it
A ticket listing what is covered and a stub listing what is not
Six hole punches scale in one by one on the covered ticket, then the stub, which starts flush against its edge, swings away and tilts to its resting angle.
Before you book
Six questions as native details in two columns under a heading
The heading glides in; each question opens as a native details element and its plus turns into a cross.
Hire the whole carriage
A photo of a long table with a crossed paper band and ribbon offering a private line
As the section arrives the cream paper band rotates into its tilt, the notched ribbon swings across it and the photo eases down from a zoom.
Ask for a seat
Office details and an enquiry form with line, month and number of travellers
The heading glides in and the carriage photo opens upward from its bottom edge.
Binario Tre Viaggi
A band of sleeper bars, the large wordmark, three columns and a legal line with the Design: 8B credit
The sleeper bars above the large wordmark slide sideways with scroll.

Before you publish the travel agency website site

Replace social preview image, favicon, phone number, email address and contact form (sends nothing yet) and the invented demo facts (prices, dates, addresses). AGENTS.md lists them.
Ask for a seat button in the nav, the link in the first screen and the Contact link in the menu lead to #contact now; point them to your booking or enquiry page, or keep #contact once the form is connected.
See the 2027 lines button in the first screen lead to #journeys now; point them to keep, or point to your full tour catalogue.
Dates buttons on the four journey tickets lead to #departures now; point them to the journey's own page or its booking page.
Reserve links in the departures table (seven rows) lead to #contact now; point them to a booking link per departure.
Plan a private line button in the private hire section lead to #contact now; point them to your group enquiry page.
Booking terms link in the footer lead to #faq now; point them to your booking terms page.
Send the enquiry button in the contact form lead to no submission; a script shows a thank-you line now; point them to your form service (Formspree, Netlify Forms) or your booking system.
The enquiry form sends nothing: connect a form service or your booking system before publishing.
The opening clips a full-screen layer on every scroll update to land on the window photo; it is the heaviest effect on the page and is skipped with reduced motion.
The seats-left column is plain text; it does not update from a booking system.
The opening photo is one 1600 px wide image with no srcset, used for both the full-bleed layer and the window, so phones load the large file.

Questions about this travel agency website template

Is this one of the free travel website templates I can use for a client?

Yes. It is one index.html under the MIT license, so you can use it for your own tours or a client's at no cost. GSAP, ScrollTrigger and Lenis load from jsDelivr, there is no build step, and the photos are Unsplash images listed in CREDITS.md.

Does the enquiry form send emails or take bookings?

No. As shipped it checks the fields, shows a thank-you line and sends nothing. Connect Formspree or Netlify Forms, or your booking system, before publishing. The seats-left column in the departures table is plain text as well, so update it by hand.

How do I give it to Claude Code or Cursor?

Download index.html and AGENTS.md with the curl lines in the README, open the folder in Claude Code, Cursor or Codex and paste the prompt from this page. It is one plain file, so the agent edits it directly. Upload index.html, LICENSE and CREDITS.md when done.

What has to stay when I change the text?

Keep every id, data-8b-section, data-8b-motion and data-8b-part, and the class names AGENTS.md lists. The two --len values count the characters of the longer title line and of the wordmark, so change them with the words. The departures table must stay a real table. Tickets and rows can be added; a fourth stop needs the three-column stop grid changed.

Does it work with reduced motion or without JavaScript?

With reduced motion the scroll scenes, smooth scrolling and entrance animations are off and the page reads in full, while the nav still hides on scroll and hover effects keep running. Without JavaScript the menu button opens nothing on narrow screens and the day section shows one photo.

Can I create a travel agency website without editing code?

Yes, with 8B's AI website builder. You describe the site in a sentence and its engine designs a new site, its own design and not this template. Designing and restyling are free; publishing with hosting and SSL, HTML export and AI edits in chat are on Pro at $9 a month billed yearly. It also runs inside Claude and ChatGPT.

Not a travel agency website? More free templates