# Sill, a free pet boarding website template > Website for a cat boarding house or pet hotel, with rooms and prices, a daily routine, the staff and a booking form. One HTML file with GSAP scroll animations, no build step, MIT license. Made by 8B (https://8b.com/). A one-page site for a small boarding house for cats with twelve rooms around a courtyard. Flat blocks of saturated colour separated by thick black gutters; a black hill rises and swallows the first screen while the house's windows light up, the day runs past on a pinned track under a changing sky, and photos peek up over their panels' edges. - Page: https://8b.com/templates/sill/ - Live demo: https://8bsite.github.io/pet-boarding-website-template/ - Repository (GitHub template): https://github.com/8bsite/pet-boarding-website-template - Download ZIP: https://github.com/8bsite/pet-boarding-website-template/archive/refs/heads/main.zip - Size: 94 KB, 25 photos (Unsplash), fonts: Gabarito, Playwrite US Modern and Rethink Sans - Motion: GSAP 3.13.0 (ScrollTrigger, SplitText); Lenis 1.3.27 smooth scroll ## Use it with an AI coding agent Download the files into the project (Windows PowerShell: `curl.exe`): ```bash curl -LO https://raw.githubusercontent.com/8bsite/pet-boarding-website-template/main/index.html curl -LO https://raw.githubusercontent.com/8bsite/pet-boarding-website-template/main/AGENTS.md curl -LO https://raw.githubusercontent.com/8bsite/pet-boarding-website-template/main/LICENSE curl -LO https://raw.githubusercontent.com/8bsite/pet-boarding-website-template/main/CREDITS.md ``` Then: ```text Read AGENTS.md, then edit index.html. Use this template as the base for a site for . Keep the layout, the motion and the single-file format; replace the brand name, copy, photos, prices, hours, staff, address, links and contacts, and recolour it through the CSS variables if needed. ``` Work on the downloaded file, not on a link. AGENTS.md lists what to keep and what to replace. Or copy the whole repository: `npx degit 8bsite/pet-boarding-website-template my-site`. ## Design Sill is a pet boarding website template for a twelve-room cattery: room types with nightly prices, evening letters from sitters, the daily routine, the team, house rules and a booking form. It also works for pet sitting or, with new photos and rules, dog boarding. - Palette: #0b0a0a (black page and gutters), #f4f1ee (off-white text), #cf6224 (orange panels, sky, wordmark), #6e1116 (maroon panels), #5a3cd4 (violet panels), #bca59d (taupe panels and form), #a97d9c (mauve panels), #80a89b (sage panels), #e3b867 (mustard panels, button hover) - Fonts: Gabarito (heavy, tight grotesk headings, set very large), Rethink Sans (body text, buttons, uppercase labels), Playwrite US Modern (handwriting for the sitters' letters) Flat, square panels of saturated colour sit on a 12-column grid, the black page showing through as thick gutters, and photos fill their panels edge to edge. Room panels differ in shape, first-visit steps rise like a staircase and black mullions cut the courtyard photo into six panes. ## Sections and motion - **Navigation** (navigation): black top bar: wordmark, five section links, Book a stay button; hides on scroll down; phone menu overlay of colour panels - **Rooms with a view, for cats.** (opening): two screens: a grid of colour panels with headline, photo, intro, price and buttons, then a facade of twelve coloured windows (demo: twelve rooms, five with cats). Motion: Smooth scrolling throughout. Scrolling on, a black hill swallows the first screen as its panels drift apart, then the facade's twelve windows fill in. - **Three shapes of room** (rooms): room types as panels of different shapes, each with photo, text and price per night, plus an "every room has" list (demo: Ledge, Tower, Burrow). Motion: Most headings rise line by line. Tied to scroll, each room panel opens out from a square in its corner. - **A letter every evening** (letters): three short notes in a handwriting font with photos (demo: the evening letters sitters send to owners); works as testimonials. Motion: Here, in the team and on the first visit, photos peek up inside their frames as you scroll and hand-drawn curls draw themselves. - **A day at Sill** (day): pinned horizontal track of six timed panels under a sky band (demo: the cats' daily schedule from 07:00 to 21:00). Motion: Pinned, the six timed panels slide sideways under a sky band that shifts through six colours as a black sun rises and sets. - **Four people, always in the house** (sitters): team of four: portraits behind coloured ledges at stepped heights, name and role on each ledge - **Every window faces the courtyard** (courtyard): one photo cut into six window panes by black mullions, with heading, text, a three-item list and a second photo with caption (demo: the courtyard view). Motion: Tied to scroll, the six panes of the window photo slide from scattered offsets into one picture as their tints fade. - **Your first visit** (visit): four numbered steps as a rising staircase of panels, a photo on the top step (demo: what happens on a first visit) - **A quiet house, by rule** (quiet): four rules or promises as panels with one big word each (demo: No dogs, One cat, Own air, Vet close). Motion: Four rule panels start tilted, scattered and orange, then settle into a row in their own colours as each big word slims. - **Questions owners ask** (faq): questions and answers (native
) beside a heading panel with a phone link - **Book a room** (contact): booking form framed by four contact panels: Call, Visit, Hours, Write (phone, address, opening hours, email are placeholders). Motion: Tied to scroll, the Call, Visit, Hours and Write panels slide in from four sides to frame the booking form. - **Footer** (footer): black footer: links, address, phone, email, a one-line note, copyright with the Design: 8B credit, and a large wordmark ## Good for - cattery or cat hotel - pet boarding or pet sitting service - dog daycare or kennel (with new photos and rules) - small guesthouse or B&B with a handful of rooms - any small service with rooms or packages, a daily schedule and a team ## Questions **Does the booking form send requests?** Not yet. It asks for names, email, dates, room and notes, then shows a thank-you line; connect it to a form service such as Formspree or Netlify Forms to receive bookings. **Can it work for a dog kennel or daycare?** Yes, with edits: swap the cat photos, room names and prices, and rewrite the four house rules, since one of them reads No dogs. The six timed slots of the day fit any boarding routine. ## Before publishing Replace: social preview image, favicon, phone number, contact form (sends nothing yet) and email address, plus the invented demo facts (prices, dates, addresses). ## License Code MIT. Photos: Unsplash License (credits in CREDITS.md). Fonts: SIL Open Font License 1.1. The "Design: 8B" footer link is optional.