Search Terms

Find the vocabulary you need for your AI prompts.

60 terms found

Accordion

UI Components

A vertically stacked list of headers that can be clicked to reveal or hide associated content panels, useful for organizing large amounts of content.

navigation

Alert

UI Components

A prominent banner or box that displays important messages, warnings, or notifications that require user attention, typically with an icon indicating severity.

feedback

Avatar

UI Components

A visual representation of a user or entity, typically displayed as a circular image, initials, or icon placeholder.

content-display

Badge

UI Components

A small visual indicator used to display status, counts, or labels. Often appears as a small circle or rounded rectangle attached to other elements.

content-display

Bottom Sheet

UI Components

A mobile UI pattern where a panel slides up from the bottom of the screen, revealing content or actions while keeping the context of the current screen visible.

overlays

Breadcrumbs

UI Components

A secondary navigation aid showing the user's location within the site hierarchy, typically displayed as a horizontal trail of links separated by arrows or slashes.

navigation

Breakpoints

Responsive Behavior

Specific screen widths where the layout or design changes to accommodate different device sizes, typically defined for mobile, tablet, and desktop views.

layout

Card

UI Components

A contained, flexible component that groups related information and actions, typically with a border, shadow, or background that visually separates it from the page.

content-display

Carousel

UI Components

A slideshow component that displays multiple items (images, cards, content) in a horizontal sequence, allowing users to navigate through them one at a time.

content-display

Checkbox

UI Components

A small square box that can be toggled between checked and unchecked states, used for selecting multiple options from a list or confirming a single choice.

inputs

Chip

UI Components

A compact element representing an input, attribute, or action, often with optional dismiss functionality. Used for tags, filters, or multi-select displays.

content-display

Contrast Ratio

Accessibility

A measurement of the luminance difference between foreground and background colors, expressed as a ratio (e.g., 4.5:1), determining text readability and accessibility compliance.

visual-accessibility

CTA (Call-to-Action)

Microcopy & UX Writing

A prompt that encourages users to take a specific action, typically presented as a button or link with action-oriented text like 'Sign Up', 'Buy Now', or 'Learn More'.

Dark Mode

Design Systems Vocabulary

An alternative color scheme that uses dark backgrounds with light text, reducing eye strain in low-light conditions and often saving battery on OLED screens.

theme

Dashboard

Page Types

An at-a-glance view that displays key metrics, charts, and summaries, giving users a quick overview of important data and system status.

app-pages

Design Tokens

Design Systems Vocabulary

Named entities that store visual design attributes (colors, typography, spacing) as reusable values, enabling consistent design across platforms and products.

foundations

Disabled State

States & Variants

The visual appearance of an element when it cannot be interacted with, typically shown with reduced opacity and without hover effects.

interactive-states

Drawer

UI Components

A panel that slides in from the edge of the screen (usually left or right) to reveal navigation, filters, or additional content without navigating away from the current view.

overlays

Dropdown

UI Components

An interactive element that reveals a list of options when clicked, allowing users to select one or more items from a collapsed menu.

inputs

Empty State

UI Components

A placeholder screen or section shown when there's no content to display, guiding users on how to get started or explaining why the area is empty.

feedback

Error State

States & Variants

The visual appearance of an element when an error has occurred, typically shown with red color and an error message explaining what went wrong.

interactive-states

FAB (Floating Action Button)

UI Components

A circular button that floats above the UI, typically in the bottom-right corner, representing the primary action of a screen.

buttons

Focus State

States & Variants

The visual appearance of an element when it receives keyboard focus, typically shown as an outline or ring, crucial for accessibility and keyboard navigation.

interactive-states

Footer

Structure

The bottom section of a webpage containing secondary navigation, legal links, contact information, and often social media links. It provides closure and additional navigation options.

page-level

Ghost Button

UI Components

A minimal button style with transparent background and only text (or text with icon), used for tertiary actions or to reduce visual clutter.

buttons

Glassmorphism

Visual Language

A design style featuring translucent, frosted-glass elements with blur effects, creating a sense of depth through transparency and layered surfaces.

elevation

Hamburger Menu

UI Components

A button consisting of three horizontal lines that, when clicked, reveals a hidden navigation menu. Named for its resemblance to a hamburger.

navigation

Header

Structure

The topmost section of a page containing the logo, navigation, and often key actions like login or search. It typically stays consistent across all pages.

page-level

Hero Section

Structure

The large, prominent section at the top of a webpage that introduces the main message, often featuring a headline, subheadline, CTA, and visual media.

page-sections

Hover State

States & Variants

The visual appearance of an interactive element when a user's cursor is positioned over it, indicating that the element is clickable or interactive.

Icon Button

UI Components

A button that displays only an icon without visible text, used for common actions where the icon meaning is universally understood.

buttons

Infinite Scroll

Navigation Patterns

A content loading pattern where new items automatically load and append to the page as the user scrolls down, creating an endless feed experience.

content-loading

Landing Page

Page Types

A standalone webpage designed for a specific marketing campaign or goal, focused on converting visitors through a single call-to-action.

Loading Spinner

UI Components

An animated circular indicator that shows users that a process is in progress, typically used during data fetching or form submissions.

feedback

Loading State

States & Variants

The visual appearance of an element or page while content is being fetched or a process is running, indicating to users that the system is working.

interactive-states

Login Page

Page Types

A page where existing users enter their credentials (email/password) to access their account and authenticated features.

authentication

Microinteraction

Interactions & Gestures

A small, contained interaction that accomplishes a single task, providing feedback and enhancing the user experience through subtle animations and responses.

feedback

Modal

UI Components

A dialog box that appears on top of the main content, requiring user interaction before returning to the underlying page. It typically includes an overlay that dims the background.

overlays

Navbar

UI Components

A horizontal navigation bar typically placed at the top of a page, containing the logo, main navigation links, and often search or user account controls.

navigation

Neumorphism

Visual Language

A design style combining flat design with subtle 3D effects, using soft shadows to create elements that appear to extrude from or sink into the background.

elevation

Onboarding Flow

Page Types

A sequence of screens or steps that introduce new users to an app or service, guiding them through setup, key features, and initial configuration.

user-journey

Pagination

UI Components

A navigation pattern that divides content into discrete pages, allowing users to move between pages using numbered links or prev/next buttons.

navigation

Popover

UI Components

A floating container that appears near a trigger element, displaying additional content, actions, or forms without leaving the current context.

overlays

Pricing Page

Page Types

A dedicated page showcasing product or service pricing options, typically displaying different tiers or plans in a comparative layout.

marketing

Primary Button

UI Components

The main action button on a page, designed to draw attention and guide users toward the most important action.

buttons

Profile Page

Page Types

A page displaying a user's personal information, account details, and often their activity or content within an application.

app-pages

Progress Bar

UI Components

A horizontal indicator that shows the completion status of a task or process, filling from left to right as progress is made.

feedback

Radio Button

UI Components

A circular input control used in groups where only one option can be selected at a time, with selecting one automatically deselecting others in the group.

inputs

Secondary Button

UI Components

A button style used for secondary or alternative actions, visually less prominent than primary buttons, typically featuring an outline or subtle background.

buttons

Sidebar

Structure

A vertical panel positioned along the left or right edge of the main content area, containing navigation, filters, or supplementary information.

page-level

Skeleton Loader

UI Components

A placeholder UI that mimics the layout of content while it's loading, using animated gray shapes to represent text, images, and other elements.

feedback

Slider

UI Components

An input control that allows users to select a value from a range by dragging a thumb along a horizontal track.

inputs

Stepper

UI Components

A control that allows users to incrementally increase or decrease a numeric value using plus/minus buttons, with an optional text input for direct entry.

inputs

Success State

States & Variants

The visual appearance of an element or notification when an action has completed successfully, typically shown with green color and a checkmark icon.

interactive-states

Table

UI Components

A structured layout displaying data in rows and columns, allowing users to compare information and often including features like sorting, filtering, and pagination.

content-display

Tabs

UI Components

A navigation pattern that organizes content into separate panels, where only one panel is visible at a time, switched by clicking horizontal tab headers.

navigation

Text Input

UI Components

A single-line form field that allows users to enter and edit text, such as names, emails, or search queries.

inputs

Toast Notification

UI Components

A small, non-blocking message that appears temporarily to provide feedback about an action, typically sliding in from the corner of the screen and auto-dismissing.

feedback

Toggle Switch

UI Components

A control that allows users to switch between two mutually exclusive states (on/off, yes/no, enabled/disabled) with immediate effect.

inputs

Tooltip

UI Components

A small informational popup that appears when hovering over or focusing on an element, providing additional context or explanation.

content-display
Search Terms - AI Vocab Prompts | AI Vocab Prompts