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.

Use this template

Appointment booking app home screen with confirmed next appointment card and service categories

Appointment booking app provider detail screen with services, ratings, and reserve button

Appointment booking app time slot picker with date strip and available session chips

Explore the screens

Preview the appointment booking mobile app design, fully editable in Sleek.

ReviewScreen 4

My BookingsScreen 5

ProfileScreen 6

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.

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.

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

Who it's for

Founders validating an appointment booking or scheduling MVP

Product designers needing a doctor-booking app starting point

Indie developers building a clinic or salon reservation app

Health and wellness teams prototyping a booking experience

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.

Questions, answered. Everything to know before you start.

How do I build an appointment booking app from this template?

Click "Use this template" to open Slate in Sleek as your own editable project, then shape it by describing the changes you want: restyle the palette, edit any screen, and add the flows your product needs. You start from six complete screens instead of a blank canvas, so you reach a working appointment booking app design far faster.

What screens are included in this appointment booking app design template?

Six connected screens: Home, Provider detail, Select Slot, Review, My Bookings, and Profile. Together they cover the core flow of a real booking app, from finding a provider and picking a time to confirming and tracking appointments.

Can I customize the appointment booking app UI design?

Yes. Use the template in Sleek and edit any screen by chatting with the AI: change the palette, swap services, adjust the time-slot layout, and add or remove flows. There's no manual redraw; you describe the change and it's applied.

Is this template suitable for a doctor appointment booking app?

Absolutely. The provider detail, slot picker, and ticket-style confirmation map cleanly onto clinics, dental practices, and medical consultations. Adjust the services, durations, and categories to fit your niche.

Can I export the design to code or Figma?

Yes. Sleek exports your design as code, copies straight into Figma with no plugin, or hands you a ready-made prompt that an AI agent like Claude Code or Cursor can use to build it into a real, working app.

Is this appointment booking app design template free to use?

You can open and explore the design for free, then use it in your own Sleek project to build on it. Editing and exporting follow Sleek's standard plans.

Something else? Write to support@sleek.design.