Productivity · Crisp Clinic White
Appointment Booking App Design Template
Slate is an appointment booking app design with a crisp clinic-white look and a signature notched-ticket motif, built for anyone shipping a scheduling or doctor-booking product.
Preview
Explore the screens
Preview the appointment booking mobile app design, fully editable in Sleek.
About the Appointment Booking App
Slate is an appointment booking app design template built around a "Crisp Clinic White" look: a warm paper-white base, near-black ink for text, and a precise teal reserved only for confirmed slots and the primary book button. Surfaces are tonal slate panels separated by hairline rules, with crisp 1px-bordered cards and a left teal accent bar for active states. The standout idea is the notched-ticket motif, where every confirmed booking and time chip reads like a torn ticket stub for the quiet satisfaction of a locked-in plan.
The template ships six connected screens that form a complete booking flow: a Home greeting with the next appointment and service categories, a Provider detail page with rating and services, a Select Slot time picker with snapping chips, a Review screen with a service ticket and calendar toggle, a My Bookings list with status badges, and a Profile with payments and reminders. Times and dates align perfectly in a tabular numeric face, so the whole UI feels orderly and trustworthy.
Use it in Sleek and make it yours: restyle the palette, edit any screen with AI by describing the change, and add the flows your product needs. Then export it to code, copy it into Figma, or hand a prompt to an AI agent to build it for real, a far faster start than a blank canvas.
What's inside
Screens included
Home
A "Good morning, Priya" greeting with an "Up Next" confirmed appointment card showing the doctor, clinic, and time, plus Reschedule and Cancel actions and an Expertise row for Salon, Dental, Wellness, and Consult. The entry point that surfaces the next visit at a glance.
Provider detail
A photo header of the clinic, a dermatology tag, a 4.8 rating with review count, and an Available Services list with durations and prices, topped by a teal "Reserve" button. This is where users pick a service before booking.
Select Slot
A horizontal date strip for January 2025 with a selected day, then morning and afternoon session chips that snap to a filled teal block, with unavailable times greyed out and a sticky selection summary and "Confirm" button. The signature time-picker that makes choosing a slot quick.
Review
A teal service-ticket summary with the notched edge showing practitioner, scheduled date, arrival time, duration, and total fee, plus Sync Calendar and Smart Reminders toggles and a "Finalize Appointment" button. Confirms every detail before committing.
My Bookings
Upcoming and History tabs listing each appointment as a ticket-stub card with status badges like Confirmed Arrival, Pending Approval, and Action Required. Keeps every visit and its state in one organized view.
Profile
An avatar with member status, historical and active booking counts as hero numbers, and a Management list for Payments, Notifications, and Privacy. The account hub for settings and booking history.
Design & features
Key features
- Crisp Clinic White aesthetic: warm paper base, ink text, one teal accent
- Signature notched-ticket motif on confirmed booking cards
- Snapping time-chip rail for morning and afternoon slots
- Tabular numeric dates and times that align in columns
- Tonal slate panels with hairline rules and crisp 1px borders
- Status badges for Confirmed, Pending, and Action Required
- Fixed bottom navigation with line icons that fill teal when active
- Review ticket with calendar sync and smart reminder toggles
Audience
Who it's for
Use cases
What you can build
- Launch an MVP for a doctor or clinic appointment booking app
- Mock up screens for an investor or stakeholder pitch
- Hand a consistent booking UI off to developers
- Explore a redesign of an existing scheduling product
How to use this template
- 1
Open the template
Browse the screens and preview the full design to see if it fits your idea.
- 2
Use this template
Open your own fully editable copy in Sleek with one click.
- 3
Edit with AI
Restyle the palette, change layouts, and add or remove screens just by describing what you want.
- 4
Export and ship
Export your design or hand it to developers, and keep building toward launch.
Frequently asked questions
Related mobile app templates
Start designing your appointment booking app
Use it in Sleek and make it yours: restyle the palette, edit any screen with AI, and export to code or Figma.
Use this template