Make Paws yours.

Seven quick changes turn this demo into your clinic.

01

Your booking link

Your booking link

Every Book button on the site uses one link. Open the Book Button component, select the button and replace the placeholder https://example.com/book with your booking page (for example Calendly, Cliniko, Jane or your practice software). Change it once and every Book button updates.

Every Book button on the site uses one link. Open the Book Button component, select the button and replace the placeholder https://example.com/book with your booking page (for example Calendly, Cliniko, Jane or your practice software). Change it once and every Book button updates.

02

Photos and the wave edge

Each page head is a colour field next to a photo. Select the photo layer to swap the image. The wavy edge is the Scallop component: pick its colour to match the field, its side and wave size, and turn Drift off for a still edge. It also holds still for visitors who prefer reduced motion.

03

Colours and type

Colours and type

Colours live in Color Styles: Yellow, Teal, Pink, Red, Mint and LilacSoft for the fields, Ink for text. Headings use Parkinsans and body text uses Rethink Sans, set in Text Styles. Change a style once and every page follows.

04

Treatments, fees and team

Treatments, fees and team

Open the CMS. Treatments feeds the treatments page, the fee list and the detail pages. Team feeds the team cards. Add, edit or reorder rows with the Order field.

Open the CMS. Treatments feeds the treatments page, the fee list and the detail pages. Team feeds the team cards. Add, edit or reorder rows with the Order field.

05

Hours and contact details

Hours and contact details

Opening hours, the address (12 Elm Street), the phone number (555-0142) and the email (hello@example.com) are placeholders. Edit them in the Footer component, the home page Visit section, the urgent band and the Contact page.

06

Motion

Motion

Scroll and load motion comes from small code overrides in Motion.tsx (for example withReveal and withStagger). To remove motion from a layer, clear its Code Override. Keep the Motion Styles layer in the Main layout.

Scroll and load motion comes from small code overrides in Motion.tsx (for example withReveal and withStagger). To remove motion from a layer, clear its Code Override. Keep the Motion Styles layer in the Main layout.

07

Using it for another clinic

Using it for another clinic

Labels are kept general, so the same pages work for a GP, physio, dental or med-spa practice. Swap the photos and words, and rename Treatments if you prefer Services.

Labels are kept general, so the same pages work for a GP, physio, dental or med-spa practice. Swap the photos and words, and rename Treatments if you prefer Services.

Create a free website with Framer, the website builder loved by startups, designers and agencies.