Components

The Appetite UI library of UI elements contains 1400+ components for building apps in Figma.
Here is a list of the most basic ones.

A toggle is a UI component that allows users to switch between two states, such as on/off, active/inactive, or enabled/disabled. Toggles are widely used in app settings, filters, and feature controls to provide quick and intuitive interactivity.

Toggle

Tabs are a UI component used to organize content into separate, easily navigable sections. They allow users to switch between views or categories without leaving the current screen, making them a powerful tool for simplifying navigation.

Tabs

A snackbar is a lightweight UI component that provides brief, non-intrusive feedback to users. Typically appearing at the bottom of the screen, snackbars deliver messages about app processes, such as confirmation of an action or an error notification.

Snackbar

A slider is a UI component that allows users to select a value or range of values by dragging a handle along a track. Sliders are commonly used for input fields where users adjust settings, such as volume, brightness, or price ranges.

Slider

Segmented tabs are a UI component used to divide content into distinct sections, allowing users to switch between views or options without leaving the current page. They are commonly used in app interfaces for navigation and filtering.

Segmented Tabs

A search bar is a UI component that enables users to input queries and quickly find content or features within an app. It’s a cornerstone of user navigation, especially in content-heavy or feature-rich apps.

Search Bar

A radio button is a UI component that allows users to select one option from a predefined group of mutually exclusive choices. Unlike checkboxes, radio buttons are designed for single-selection scenarios, ensuring users can only choose one option at a time.

Radio Button

Popup navigation is a UI component that displays a temporary menu or list of options in response to user interaction, such as a click or tap. Unlike traditional navigation bars, popups provide context-specific options without taking users away from their current view.

Popup

Pagination is a UI component used to divide content into manageable chunks or pages. It helps users navigate through large datasets or content collections efficiently, often seen in lists, search results, or content libraries.

Pagination

A navigation bar is a core UI component that provides users with easy access to key sections or features of an app. It’s typically displayed at the top or bottom of the screen and plays a crucial role in guiding users through the app.

Navigation Bar

A menu is a UI component that provides a list of options or actions for users to select from. It’s widely used for navigation, actions, or filtering, making it an essential part of app design.

Menu

‍An input field is a fundamental UI component that allows users to enter data, such as text, numbers, or passwords. They are critical for collecting user input in forms, search bars, and other interactive app elements.

Input Field

A chip is a compact UI component used to display information, filter content, or trigger actions. Chips are visually distinct elements that often include text, icons, or both, and can represent categories, tags, selections, or actions in an app.

Chip

A checkbox is a simple, versatile UI component used to let users select one or more options from a list. It’s commonly used in forms, filters, and settings to capture user preferences or actions.

Checkbox

A button is a fundamental UI component that allows users to perform actions or navigate within an app. Buttons are critical for interaction design, guiding users toward completing tasks like submitting forms, navigating pages, or triggering commands.

Button

Breadcrumbs are a UI navigation element that displays the user’s current location within an app or website hierarchy. They act as a trail, allowing users to retrace their steps and understand the structure of the interface.

Breadcrumb

A bottom sheet is a versatile UI container used to display additional content, tasks, or actions while maintaining visibility of the parent view. It’s particularly effective in mobile interfaces as it allows users to interact with supplementary content without losing their original context.

Bottom Sheet

Badges are used to convey the status or highlight key information about an element or an action performed, providing users with quick visual feedback.

Badge

Ready to take your
designs to the next level?

Appetite UI is everything you’ve been looking for in a design system – powerful, flexible, and built to streamline your creative process. Start building beautiful apps today!

Buy now