Color collection
Restaurant Color Palettes
Restaurant palettes for reservation sites, menus, hospitality brands, and food landing pages.
RestaurantWarmLuxury
Best for: restaurants, booking pages, and hospitality brandsExport: CSS, Tailwind, JSON, SVGPreview: dashboard, landing, mobile UI
Restaurant 4Restaurant / Warm / LuxuryQuality 98Primary
#3171D8Accent#AE51D6Surface#EBEEF4Text#121721Support#CE829FRestaurant 3Restaurant / Warm / LuxuryQuality 96Primary#31A0D8Accent#D67E51Surface#EBF0F4Text#121B21Support#CE82B5Restaurant 5Restaurant / Warm / LuxuryQuality 96Primary#3142D8Accent#D651C0Surface#ECEBF4Text#121321Support#CE828ARestaurant 7Restaurant / Warm / LuxuryQuality 96Primary#7F31D8Accent#D65F51Surface#F1EBF4Text#1A1221Support#CEA682Restaurant 24Restaurant / Warm / LuxuryQuality 96Primary#31A9D8Accent#51D656Surface#EBF0F4Text#121C21Support#CE82B9Restaurant 6Restaurant / Warm / LuxuryQuality 95Primary#5031D8Accent#D65182Surface#EEEBF4Text#161221Support#CE9082How to use these palettes
Start with the primary and surface colors, then test text contrast before exporting. These palettes are most useful for restaurants, booking pages, and hospitality brands. Choose one appetite-friendly warm accent and keep menu text high contrast.
Luxury palettes keep metallic or deep tones as accents while preserving a clear text and surface pair for editorial layouts.
UI previewPrimary
Card
Button
Accent
CSS Variables
:root {
--primary: #3171D8;
--accent: #AE51D6;
--surface: #EBEEF4;
--text: #121721;
--support: #CE829F;
}Text / Surface contrast: 15.44:1
FAQ
Where should I use restaurant color palettes?
These palettes are designed for restaurants, booking pages, and hospitality brands.
Can I copy these colors into a design system?
Yes. Each palette includes clear interface roles such as Primary, Accent, Surface, Text, and Support.
How do I avoid low contrast?
Choose one appetite-friendly warm accent and keep menu text high contrast.