Live Example

Skip Navigation

FOUNDATIONS

RESOURCES

SHOWCASE

XD IN PRACTICE

SEARCH

SEARCH

FOUNDATIONS

Foundations

See the standards we always follow and find additional guidance to help you create cohesive digital experiences that are uniquely MetLife.

Getting Started

Getting Started

Using the Global Design System

Standards

Standards

Logo
Typography
Color
User Interface Elements
Tone of Voice
Experience Principles
Accessibility

Core Guidance

Core Guidance

Illustration
Icons
Photography
Layout & Grid
Data Visualization
Graphics
Conversational UI

RESOURCES

Designers

Developers

Designers

Getting Started

Designer Resources Overview

Responsive Web Guidance

Components
Templates
User Flows

Native App Guidance

Components
User Flows

Marketing & Advertising Guidance

Email
Social
Online Ads

Developers

Getting Started

Developer Resources Overview

MetLife Design Components (MLDC)

React Library (Web)

SHOWCASE

Showcase

Explore digital brand expression from MetLife teams around the world to give you the creative reference and inspiration to do more great work.

Case Study

Case Study

Post-Purchase Experience

Digital Brand Expression

Digital Brand Expression

United States
Mexico
Chile
Japan
South Korea

XD IN PRACTICE

XD in Practice

Get advice, learn best practices, and discover ways to work efficiently and collaboratively, from planning to execution. Accessing this page requires connecting to the MetLife VPN.

Designing Your Corporate Website

Designing Your Corporate Website

Plan: Start Here
Phase 2: Discovery/Define
Phase 3: Design
Phase 4: Deliver
Phase 5: Improve

Website Design Fundamentals

Website Design Fundamentals

Technology Enhancements
New Components for Design
Content Authoring Support

Keys to Success

Keys to Success

What is Experience Design?
The XD Process: Step by Step
Working with Designers
Understanding Usability

Enter your search here

Auto Complete

0 of 0 Search Results

| Displaying

No Results

Sorry, we couldn't find any results matching

Please:

Check the spelling and try again
Search using fewer terms
Click here for Customer Support

Did you mean ""

Did you mean ?

Sorry, we couldn't find any results matching

Please:

Check the spelling and try again
Search using fewer terms
Click here for Customer Support

WYSIWYG (Rich Text Editor)

Live Example

Hero Event

Hero Event

Text: Left & Color: White

This hero component showcases an event and briefly describes important information about the event.

Foundations

Resources

Responsive Web Guidance

Native App Guidance

Marketing & Advertising Guidance

Showcase

Digital Brand Expression

XD in Practice

Designing Your Corporate Website (VPN only)

Keys to Success

DIGITAL ASSET MANAGEMENT

MARKETING TECHNOLOGY CENTER

JOURNEY MAPS INSIGHTS ENGINE

Privacy Policy Terms of use

© 2024 MetLife Services and Solutions, LLC
New York, NY 10166 - All Rights Reserved.