Cookbook is Yelp's design system for digital experiences, and follows Brad Frost's Atomic Design methodology. Our system carries through with the food analogy by using ingredients for our styles, recipes for our components, and entrees for complex components.
A system of type and color styles designed with accessibility in mind, used across our Recipes.
Primary brand color, used on primary buttons, badges, and map pins. Also used as error/destructive color.
Link/active text color, also used for selections (e.g. pills, checkboxes) and Biz secondary buttons.
Primary display type, used for headings and emphasis text.
Primary body type, used for paragraphs, links, and more.
A series of scalable components that bring consistency to your interactions with Yelp products.
Small indicators that highlight important information.
Actionable touchpoints users engage with.
Row of stars to display or input a business rating.
Features and options that can be selected within the UI.
Good design is subjective, so we built a set of considerations that help us assess the quality of our work and make critical decisions.
Lead the way with intentional, clear design and make navigation feel smooth and seamless.
Create an inclusive space for our diverse community of users and business owners.
Strive to help users walk away with what they were looking for—even more, when appropriate.
Get to know who we’re designing for. Think about where they are and where they’re headed next.
Give accurate information and relevant navigation. Respect people’s time and trust will come naturally.