PlayReserve UI Kit

Colors

Brand Colors

Primary Green

#0EA47A

Primary Light

#10D9A0

Accent Orange

#F97316

Accent Light

#FB923C

Semantic Colors

Success

#22C55E

Warning

#EAB308

Error

#EF4444

Info

#3B82F6

Neutrals (Warm Gray)

Gray 50

#FAFAF9

Gray 200

#E7E5E4

Gray 400

#A8A29E

Gray 600

#57534E

Gray 800

#292524

Gray 900

#1C1917

Typography

Font Family: Plus Jakarta Sans

Display Title

Plus Jakarta Sans 800 • 3.5rem • letter-spacing: -0.03em

Heading 1 - Zarezerwuj kort

Plus Jakarta Sans 700 • 2.5rem • letter-spacing: -0.02em

Heading 2 - Wybierz termin

Plus Jakarta Sans 700 • 2rem • letter-spacing: -0.01em

Heading 3 - Bilard Club Warszawa

Plus Jakarta Sans 600 • 1.5rem

Heading 4 - Podsumowanie rezerwacji

Plus Jakarta Sans 600 • 1.25rem

Body text - Zarezerwuj stół bilardowy w swoim ulubionym klubie. Płatność z góry gwarantuje Twoje miejsce bez ryzyka no-show.

Plus Jakarta Sans 400 • 1rem • line-height: 1.7

Small text - Anulacja do 7 dni przed = pełny zwrot na portfel klubowy

Plus Jakarta Sans 400 • 0.875rem

Caption / Label

Plus Jakarta Sans 500 • 0.75rem • uppercase • letter-spacing: 0.08em

Buttons

Primary (CTA - Orange)

Secondary (Green)

Outline

Ghost

Form Elements

Email

Wyślemy potwierdzenie na ten adres

Telefon

Email (błąd)

Nieprawidłowy format adresu email

Wyszukaj klub

Time Slots

Wybierz godzinę

09:00

10:00

11:00

12:00

13:00

14:00

15:00

16:00

17:00

18:00

19:00

20:00

Badges

Dostępny Promocja -20% Potwierdzona Oczekuje Anulowana Bilard Squash Tenis

Alerts

✓

Rezerwacja potwierdzona! Szczegóły wysłaliśmy na Twój email.

⚠

Uwaga: Anulacja mniej niż 24h przed wizytą = brak zwrotu.

✕

Błąd płatności. Sprawdź dane karty i spróbuj ponownie.

ℹ

Masz środki w portfelu! 45 PLN zostanie automatycznie użyte przy płatności.

Cards

🎱

Dostępny dziś

Bilard Club Warszawa

ul. Marszałkowska 123, Śródmieście

⭐ 4.8 📍 2.3 km 🎱 8 stołów

40 PLN / godzina

🎾

Wolne: 14:00

Squash Center Pro

ul. Puławska 456, Mokotów

⭐ 4.6 📍 4.1 km 🏸 6 kortów

60 PLN / godzina

🎯

Darts Arena

ul. Nowy Świat 789, Centrum

⭐ 4.9 📍 1.2 km 🎯 12 tarcz

25 PLN / godzina

Booking Summary

Podsumowanie rezerwacji

Klub Bilard Club Warszawa

Data Sobota, 28 grudnia 2025

Godzina 13:00 - 15:00

Stół Stół #3 (9ft)

Czas 2h × 40 PLN

Środki z portfela -45 PLN

Do zapłaty 35 PLN

Portfel klubowy

45,00 PLN

💳 Bilard Club Warszawa

Booking Stepper

✓

Wybierz klub

✓

Wybierz termin

3

Płatność

4

Potwierdzenie

Navigation

Tabs

Sport Filter

Avatars

JK

Sport Icons

🎱

🎾

🎯

🎳

🏸

🏓

Spacing Scale

4px

8px

12px

16px

24px

32px

48px

64px

Border Radius

6px (sm)

8px (md)

12px (lg)

16px (xl)

full

Select / Dropdown

Liczba godzin

Wybierz stół

Sport

Checkbox, Radio & Toggle

Checkbox

✓

Akceptuję regulamin

Zapisz kartę na przyszłość

✓

Chcę otrzymywać promocje

Radio

💳 Karta płatnicza

📱 BLIK

🏦 Przelew online

Toggle

Powiadomienia push

Email o promocjach

Przypomnienia SMS

Toast Notifications

✓ Rezerwacja zapisana

✓ Płatność zaakceptowana

✕ Błąd połączenia

Loading States

Spinners

Skeleton

Empty State

📅

Brak rezerwacji

Nie masz jeszcze żadnych rezerwacji. Znajdź klub i zarezerwuj swój pierwszy termin!

Reservation Cards

🎱

Bilard Club Warszawa

Stół #3 (9ft)

Potwierdzona

📅 Sobota, 28 grudnia • ⏰ 13:00 - 15:00 • 💰 80 PLN

🎾

Squash Center Pro

Kort #2

Oczekuje na płatność

📅 Niedziela, 29 grudnia • ⏰ 10:00 - 11:00 • 💰 60 PLN

Cancellation Ladder

📋 Polityka anulacji

≥ 7 dni

100%

6 dni

80%

3-5 dni

50-70%

1-2 dni

10-30%

Dzień D

0%

Zwrot trafia na portfel klubowy, nie na kartę.

Modal / Dialog

Calendar

Grudzień 2025

Pn

Wt

Śr

Cz

Pt

So

Nd

25

26

27

28

29

30

31

1

2

3

4

5

6

7

Search

🔍

🎱

Bilard Club Warszawa

ul. Marszałkowska 123

🎱

Bilard & Snooker Klub

ul. Świętokrzyska 45

Rating / Stars

★ ★ ★ ★ ★ 4.0

★ ★ ★ ★ ★ 4.8 (127 opinii)

Accordion / FAQ

Jak działa polityka anulacji? ▼

Zwrot zależy od czasu pozostałego do rezerwacji. Im wcześniej anulujesz, tym większy procent odzyskasz. Środki trafiają na Twój portfel klubowy, nie na kartę.

Czy mogę zmienić termin rezerwacji? ▼

Co to jest portfel klubowy? ▼

Table

Data	Klub	Zasób	Czas	Kwota	Status
28.12.2025	Bilard Club Warszawa	Stół #3	13:00 - 15:00	80 PLN	Zrealizowana
25.12.2025	Squash Center Pro	Kort #2	10:00 - 11:00	60 PLN	Anulowana
20.12.2025	Darts Arena	Tarcza #5	18:00 - 20:00	50 PLN	Zrealizowana

Pagination

‹

1

2

3

...

12

›

Dividers

Treść powyżej

Treść poniżej

lub

Mobile Bottom Navigation

🏠 Kluby 📅 Rezerwacje 💳 Portfel 👤 Profil

Footer

Rezerwuj korty, stoły i boiska w swoich ulubionych klubach. Płatność z góry, zero stresu.

Textarea

Notatka do rezerwacji

0 / 500 znaków

Wiadomość do klubu

89 / 500 znaków

Breadcrumbs

Number Input

Liczba godzin

2

godz.

Liczba graczy

1

os.

Chip / Tag

Filtry sportów

🎱 Bilard ×

🎾 Squash ×

🎯 Darts

🎳 Bowling

🏸 Badminton

Tagi klubu

Parking

Wi-Fi

Bar

Klimatyzacja

Dostępny dla niepełnosprawnych

Progress Bar

Standard

Postęp płatności 75%

Warianty

Icon Button

Notification Badge

3

12

99+

Link Styles

Default link Underline link Muted link Zobacz więcej Regulamin zewnętrzny

Przed rezerwacją zapoznaj się z regulaminem oraz polityką anulacji.

Image / Photo

Square

🎱

Landscape 4:3

📷

Video 16:9

🎬

Circle Avatar

JK

Gallery

1

2

3

Image with overlay

🎱

Bilard Club Warszawa

8 stołów • od 40 PLN/h

Map

🗺️

Mapa lokalizacji

Bilard Club Warszawa

ul. Marszałkowska 123

Success Page

✓

Rezerwacja potwierdzona!

Twoja rezerwacja została pomyślnie utworzona. Szczegóły wysłaliśmy na adres [email protected]

Numer rezerwacji PR-2024-1234

Klub Bilard Club Warszawa

Data i godzina 28.12.2025, 13:00 - 15:00

Zapłacono 80 PLN

Error Pages

404

Strona nie istnieje

Przepraszamy, nie możemy znaleźć strony której szukasz.

📡

Brak połączenia

Sprawdź swoje połączenie internetowe i spróbuj ponownie.

QR Code

Pokaż ten kod w recepcji

PR-2024-1234

Filter Sidebar

Wyczyść

Slider / Range

Odległość od lokalizacji

0 km 5 km 10 km

Dropdown Menu

Button Group

Input Group

Cena

PLN

Telefon

+48

Stat Cards

Rezerwacje tego miesiąca

127

↑ 12% vs poprzedni

Przychód

8,450 PLN

↑ 8%

Anulacje

4.2%

↓ 2%

Średnia ocena

4.8 ⭐

↑ 0.2

Timeline

✓

28.12.2025, 10:32

Rezerwacja utworzona

Płatność potwierdzona - 80 PLN

✓

28.12.2025, 10:33

Email potwierdzający

Wysłano na [email protected]

⏳

28.12.2025, 12:00

Przypomnienie SMS

Zaplanowane - 1h przed wizytą

28.12.2025, 13:00

Rozpoczęcie rezerwacji

Copy Button

PR-2024-1234 📋

https://play-reserve.com/r/abc123 📋

Admin Sidebar

Menu główne

📊 Dashboard

📅 Rezerwacje 12

🎱 Zasoby

👥 Klienci

Finanse

💰 Przychody

📈 Raporty

Ustawienia

⚙️ Konfiguracja

💳 Cennik

Data Table

✓

3 wybrane

	Data	Klient	Zasób	Godziny	Kwota	Status
✓	28.12.2025 13:00-15:00	JK Jan Kowalski [email protected]	🎱 Stół #3	2h	80 PLN	Potwierdzona
✓	28.12.2025 16:00-18:00	AN Anna Nowak [email protected]	🎾 Kort #1	2h	120 PLN	Oczekuje
✓	29.12.2025 10:00-12:00	PW Piotr Wiśniewski [email protected]	🎱 Stół #1	2h	80 PLN	Anulowana

Schedule Grid (Weekly View)

Pon

23.12

Wt

24.12

Śr

25.12

Czw

26.12

Pt

27.12

Sob

28.12

Nd

29.12

10:00

Jan K.

Zamknięte

Anna N.

11:00

Piotr W.

Zamknięte

Maria S.

12:00

Resource Card (Table/Court Management)

🎱

Stół #1

Brunswick Gold Crown

Aktywny

127

Rezerwacji

89%

Obłożenie

4.8

Ocena

🎱

Stół #2

Diamond Pro-Am

Serwis

98

Rezerwacji

76%

Obłożenie

4.6

Ocena

🎱

Stół #3

Nieaktywny

Wyłączony

—

Rezerwacji

—

Obłożenie

—

Ocena

Revenue Card

Przychód Grudzień 2025

12,450 PLN

↑ 12% vs listopad

187

Rezerwacje

66 PLN

Śr. wartość

4.2%

Anulacje

Rezerwacje w tym tygodniu

Pricing Editor

08:00 - 12:00

Pn

Wt

Śr

Cz

Pt

So

Nd

PLN

12:00 - 18:00

Pn

Wt

Śr

Cz

Pt

So

Nd

PLN

18:00 - 23:00

Pn

Wt

Śr

Cz

Pt

So

Nd

PLN

Availability Toggle

Poniedziałek

10:00 - 22:00

Wtorek

10:00 - 22:00

Środa

Zamknięte

Czwartek

10:00 - 22:00

Settings Panel

🔔

Powiadomienia

Zarządzaj alertami i notyfikacjami

Nowe rezerwacje

Otrzymuj powiadomienie przy każdej nowej rezerwacji

Anulacje

Powiadom mnie o anulowanych rezerwacjach

Raporty tygodniowe

Podsumowanie tygodnia co poniedziałek

Notification Panel

Powiadomienia Oznacz jako przeczytane

📅

Jan Kowalski zarezerwował Stół #3 na 28.12.2025

2 minuty temu

💰

Otrzymano płatność 80 PLN za rezerwację #1234

5 minut temu

❌

Anna Nowak anulowała rezerwację na 27.12.2025

1 godzinę temu

ℹ️

Raport tygodniowy jest gotowy do pobrania

Wczoraj

Profile Card

Program lojalnościowy 🥈 Silver

1,240 pkt

Jeszcze 260 pkt do poziomu Gold

1,240 / 1,500 pkt Do Gold: 260 pkt

Quick Actions

Rezerwuj

Portfel

Ulubione

Upcoming Reservations Widget

Nadchodzące rezerwacje 3

28

Gru

Bilard Club Warszawa

13:00 - 15:00 • Stół #3

🎱

30

Gru

Squash Center

18:00 - 19:00 • Kort #2

🎾

02

Sty

Bowling Arena

20:00 - 22:00 • Tor #5

🎳

Favorites List

🎱

Bilard Club Warszawa

ul. Marszałkowska 123 • 2.3 km

🎾

Squash Center Mokotów

ul. Puławska 45 • 4.1 km

Achievement Badges

🏆

Pierwszy krok

Dokonaj pierwszej rezerwacji

⭐

Stały bywalec

10 rezerwacji w jednym klubie

🎯

Punktualność

20 rezerwacji bez spóźnienia

15 / 20

👑

VIP

Osiągnij poziom Gold

1,240 / 1,500 pkt

Payment Method Selection

VISA

Visa •••• 4242

Wygasa 12/26

✓

MC

Mastercard •••• 8888

Wygasa 03/25

BLIK

Wprowadź kod przy płatności

Referral Card

🎁

Poleć znajomym

Zaproś znajomych i otrzymaj 50 PLN na portfel za każdą osobę która dokona rezerwacji!

JANKO50 📋

5 Zaproszonych

150 PLN Zarobione

Notification Preferences

📧

Potwierdzenia email

Otrzymuj potwierdzenia rezerwacji na email

📱

SMS przed wizytą

Przypomnienie 1h przed rezerwacją

🔔

Push notifications

Powiadomienia w aplikacji mobilnej

💰

Promocje i oferty

Informacje o zniżkach i specjalnych ofertach

History Filter

Social Login Buttons

lub

Cancellation Ladder

Polityka anulacji

100%

Powyżej 24h przed wizytą

Pełny zwrot na portfel klubowy

75%

12-24h przed wizytą ← Jesteś tutaj

Zwrot 75% na portfel klubowy

50%

2-12h przed wizytą

Zwrot 50% na portfel klubowy

0%

Poniżej 2h przed wizytą

Brak zwrotu

⚠️

Anulowanie rezerwacji

Anulując teraz otrzymasz zwrot 60 PLN (75%) na portfel klubowy.

Kwota rezerwacji 80 PLN

Zwrot (75%) +60 PLN

Utrata -20 PLN

Rating & Reviews

Rating Display

★ ★ ★ ★ ★ 4.0

★ ★ ★ ★ ★ 4.8 (127 opinii)

Interactive Rating

★ ★ ★ ★ ★

Kliknij gwiazdkę, aby ocenić

Rating Breakdown

5

89

4

25

3

9

2

3

1

Review Cards

JK

Jan Kowalski

2 dni temu

★ ★ ★ ★ ★

Świetny klub! Stoły w doskonałym stanie, obsługa bardzo miła. Na pewno wrócę.

AN

Anna Nowak

1 tydzień temu

★ ★ ★ ★ ★

Bardzo dobra lokalizacja i atmosfera. Jedyny minus - mogłoby być więcej miejsc parkingowych.

Invoice Card

FV/2025/12/001

Wystawiona: 01.01.2026

Opłacona

Okres rozliczeniowy Grudzień 2025

Liczba rezerwacji 187

GMV (wartość brutto) 12,450 PLN

Prowizja netto (1%) 124.50 PLN

VAT (23%) 28.64 PLN

Do zapłaty 153.14 PLN

FV/2025/11/001

Termin: 08.12.2025

Zaległa

Okres rozliczeniowy Listopad 2025

Liczba rezerwacji 156

Do zapłaty 128.47 PLN

Date Picker

Grudzień 2025

Pn

Wt

Śr

Cz

Pt

Sb

Nd

25

26

27

28

29

30

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

Pagination

... Pokazuję 1-10 z 120

FAQ Accordion

Jak mogę anulować rezerwację? ▼

Rezerwację możesz anulować w zakładce "Moje rezerwacje". Kliknij na rezerwację którą chcesz anulować, a następnie wybierz "Anuluj rezerwację". Pamiętaj, że wysokość zwrotu zależy od czasu pozostałego do rezerwacji.

Jak działa portfel klubowy? ▼

Portfel klubowy to Twoje saldo przypisane do konkretnego klubu. Środki trafiają tam z anulowanych rezerwacji i są automatycznie wykorzystywane przy następnej rezerwacji w tym klubie.

Czy mogę zmienić termin rezerwacji? ▼

Tak, możesz zmienić termin rezerwacji. Przejdź do "Moje rezerwacje", wybierz rezerwację i kliknij "Zmień termin". Opłata za zmianę terminu jest taka sama jak za nową rezerwację.

Jakie metody płatności są dostępne? ▼

Akceptujemy karty płatnicze (Visa, Mastercard), BLIK, Apple Pay oraz Google Pay.

Cookie Banner

Online Indicator

Online

Zajęty

Offline

Operating Hours

Otwarte teraz Zamyka o 22:00

Poniedziałek 10:00 - 22:00

Wtorek 10:00 - 22:00

Środa Zamknięte

Czwartek 10:00 - 22:00

Piątek 10:00 - 24:00

Sobota (dziś) 12:00 - 24:00

Niedziela 12:00 - 22:00

Status warianty

Otwarte ⏰ Zamyka za 30 min Zamknięte

Verification Badge

✓ Zweryfikowany ✓ Zweryfikowany klub

Bilard Club Warszawa ✓

PlayReserve

Colors

Typography

Buttons

Form Elements

Time Slots

Badges

Alerts

Cards

Booking Summary

Booking Stepper

Navigation

Tabs

Avatars

Sport Icons

Spacing Scale

Border Radius

Select / Dropdown

Checkbox, Radio & Toggle

Toast Notifications

Loading States

Empty State

Reservation Cards

Cancellation Ladder

Modal / Dialog

Calendar

Search

Rating / Stars

Accordion / FAQ

Table

Pagination

Dividers

Mobile Bottom Navigation

Footer

Textarea

Breadcrumbs

Number Input

Chip / Tag

Progress Bar

Icon Button

Notification Badge

Link Styles

Image / Photo

Map

Success Page

Rezerwacja potwierdzona!

Error Pages

Strona nie istnieje

Brak połączenia

QR Code

Filter Sidebar

Slider / Range

Dropdown Menu

Button Group

Input Group

Stat Cards

Timeline

Copy Button

Panel Administracyjny

Admin Sidebar

Data Table

Schedule Grid (Weekly View)

Resource Card (Table/Court Management)

Revenue Card

Pricing Editor

Availability Toggle

Settings Panel

Notification Panel

Panel Gracza

Profile Card

Quick Actions

Upcoming Reservations Widget

Favorites List

Achievement Badges

Payment Method Selection

Referral Card

Notification Preferences

History Filter

Dodatkowe Komponenty

Social Login Buttons