This site is not optimized for mobile viewing - please access on a laptop, desktop or tablet.

 

(Or, expand your browser window)

Foundations

Global elements and rules to drive consistency

Typography

Typefaces, sizes, weights, and styles establish visual hierarchy and reinforce brand identity across digital platforms.

Color & Themes

Color and theme choices shape the entire feel of the digital experience. Consistent, scalable patterns ensure every interaction reflects brand identity, supports usability, and enhances visual clarity.

UI Iconography

Provide contextual visual support to user interface elements like navigation, buttons, badges, controls, downloads, and documents.

Responsive Grid

Provides a consistent structural foundation for responsive layout behavior across screen sizes.

Spacing

Spacing creates rhythm, clarity, and harmony across the site. It ensures that content isn’t crowded or uneven to help users easily focus on relevant information.

Layout & Hierarchy

Effective layout and hierarchy help users quickly understand your content and navigate with confidence.

Photo Digital Guide

Guidance for using photography effectively across digital layouts, patterns, and responsive environments.

Video Digital Guide

Guidance for using video effectively across digital layouts, patterns, and responsive environments.

Patterns

Modules that appear commonly across pages and experiences

Mastheads

Mastheads are prominent website headers designed to introduce the page and engage users.

Content Cards

A general container used to populate a page with rich content, ranging from top features to OC article redirects.

Banners

A general container used to populate a page with rich content that typically centers around a dedicated promotion or product launch.

Product Cards

A general container used to highlight priority content, limbos, and top features for relevant products.

Pop-Ups & Dialogues

Pop-ups and dialogs are lightweight UI elements that inform users or guide them through actions without leaving the current screen.

Value Props

Horizontal content modules that highlight key RTBs to help shoppers understand the benefits of buying from .com.

Disclaimers

Provide required on-page legal copy related to claims, promotions, or product details.

Forms

Areas on a page that collect user information to enable account creation, checkout, or newsletter sign-up.

Pencil Banners

A narrow banner used to deliver short, high-priority messages at the top of a page.

Content Modals

Interactive windows that appear above regular page content, used to offer additional content a user may be interested in.

Visual Navigation

Uses product limbos or icons to help users make quick selections without relying solely on text.

Sticky Navigation

Keeps key menu items fixed in place as users scroll, making important navigation accessible throughout a page.

Elements

Common building blocks that get used throughout the site

Buttons

Interactive elements that clearly signal actionable tasks, enabling users to engage with and navigate digital interfaces.

Chips

Interactive UI text elements that help users make selections, enter information, or filter content.

Tab Controls

Organizes content into sections to allow users to quickly switch between related items without leaving the page.

Carousel Controls

Provide users with manual control over a rotating series of content slides within a carousel component.

Badges

A visual callout that helps differentiate, highlight, or sort content.

Tooltips

Small text boxes that appear upon hover or clicking that display additional context while keeping interfaces uncluttered.

Notifications

Timely alerts or updates that appear briefly to provide information, statuses, or reminders to users with minimal disruption.

Cross-brand digital style guide

This multi-brand digital style guide provides clear, consistent standards for Whirlpool, KitchenAid, Maytag, and Amana. It covers foundations like typography and color, patterns such as mastheads and content cards, and elements like buttons and notifications.

Foundations

Patterns

Elements

Foundations

Global elements and rules to drive consistency

Typography

Typefaces, sizes, weights, and styles establish visual hierarchy and reinforce brand identity across digital platforms.

Color & Themes

Color and theme choices shape the entire feel of the digital experience. Consistent, scalable patterns ensure every interaction reflects brand identity, supports usability, and enhances visual clarity.

UI Iconography

Provide contextual visual support to user interface elements like navigation, buttons, badges, controls, downloads, and documents.

Responsive Grid

Provides a consistent structural foundation for responsive layout behavior across screen sizes.

Spacing

Spacing creates rhythm, clarity, and harmony across the site. It ensures that content isn’t crowded or uneven to help users easily focus on relevant information.

Layout & Hierarchy

Effective layout and hierarchy help users quickly understand your content and navigate with confidence.

Photo Digital Guide

Guidance for using photography effectively across digital layouts, patterns, and responsive environments.

Video Digital Guide

Guidance for using video effectively across digital layouts, patterns, and responsive environments.

Patterns

Modules that appear commonly across pages and experiences

Mastheads

Mastheads are prominent website headers designed to introduce the page and engage users.

Content Cards

A general container used to populate a page with rich content, ranging from top features to OC article redirects.

Banners

A general container used to populate a page with rich content that typically centers around a dedicated promotion or product launch.

Product Cards

A general container used to highlight priority content, limbos, and top features for relevant products.

Pop-Ups & Dialogues

Pop-ups and dialogs are lightweight UI elements that inform users or guide them through actions without leaving the current screen.

Value Props

Horizontal content modules that highlight key RTBs to help shoppers understand the benefits of buying from .com.

Disclaimers

Provide required on-page legal copy related to claims, promotions, or product details.

Forms

Areas on a page that collect user information to enable account creation, checkout, or newsletter sign-up.

Pencil Banners

A narrow banner used to deliver short, high-priority messages at the top of a page.

Content Modals

Interactive windows that appear above regular page content, used to offer additional content a user may be interested in.

Visual Navigation

Uses product limbos or icons to help users make quick selections without relying solely on text.

Sticky Navigation

Keeps key menu items fixed in place as users scroll, making important navigation accessible throughout a page.

Elements

Common building blocks that get used throughout the site

Buttons

Interactive elements that clearly signal actionable tasks, enabling users to engage with and navigate digital interfaces.

Chips

Interactive UI text elements that help users make selections, enter information, or filter content.

Tab Controls

Organizes content into sections to allow users to quickly switch between related items without leaving the page.

Carousel Controls

Provide users with manual control over a rotating series of content slides within a carousel component.

Badges

A visual callout that helps differentiate, highlight, or sort content.

Tooltips

Small text boxes that appear upon hover or clicking that display additional context while keeping interfaces uncluttered.

Notifications

Timely alerts or updates that appear briefly to provide information, statuses, or reminders to users with minimal disruption.

Cross-brand digital style guide

This multi-brand digital style guide provides clear, consistent standards for Whirlpool, KitchenAid, Maytag, and Amana. It covers foundations like typography and color, patterns such as mastheads and content cards, and elements like buttons and notifications.