Progressive Insurance | Dev Page / Components
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Paragraph / body text. Here is a link example. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse luctus ultricies neque ut aliquam. Proin nulla eros, egestas eget convallis vel, varius eget tellus. Etiam eleifend ante vel semper facilisis. Fusce malesuada eros sed bibendum suscipit. Vivamus pharetra felis urna, eu dapibus dolor vehicula at. Sed consequat dapibus metus, euismod tincidunt nisi auctor at. Cras commodo dapibus massa pretium fermentum. Aenean molestie sed augue id luctus. Fusce porta lacinia nisi, varius sodales augue aliquet vel. Nam lacinia consectetur libero, tincidunt viverra erat pretium id.
Here's some lists and stuff
- Unordered list item 1
- Unordered list item 2
- Unordered list item 3
- Ordered list item 1
- Ordered list item 2
- Ordered list item 3
Flo: Our #1 Brand Icon
For more than a decade, Flo’s name, face, and perky attitude have become synonymous with Progressive. Appearing in everything from iconic TV spots to social media accounts to helpful AI chatbots and merchandise, Flo’s image, personality, and tone of voice can be used as quick and reliable brand recognition for our company.
That said, we’re thoughtful and deliberate about how we use Flo and her essence, with contracts driving many decisions. This includes her illustrated form as well. That’s why we caution to never use anything Flo-related (merchandise, presentations shown outside of Progressive walls, billboards, videos, etc.) without explicit permission from the Marketing department first.
Quite simply, utilizing Flo (or her likeness) could result in legal ramifications for you and/or your company. This is extremely important when using photos or videos of Flo. The same rules apply to using Jamie, Mara, Alan, and any of our other network characters.
If you’d like to use Flo, any of her iterations, or any other network character for any reason, please contact Progressive Marketing or brand@progressive.com.

Icons
Icons translate our products into bite-sized, visual nuggets. Like everything else, they are an important communication aid and have guidelines to ensure they make the best impact. Before working with iconography, check out our icon best practices.
Primary Icons
The primary icons represent our products and services. This is our main set of icons. These icons have a stroke weight of 1px and are typically between 50-100px or larger.
















Secondary Icons
The primary icons represent our products and services. If the product icon is displayed at less than 50px, these more simplified icons should be used with a 1px stroke weight.
















Utility Icons
Utility icons support navigation, actions, and interface affordances. Keep the stroke weight consistent and use them sparingly so they remain clear cues for interaction. For guidance, contact brand@progressive.com.
















Special Lines
Motorcycle
- Cruisers
- Sport bike
- Touring
- Adventure / dual sport
- Off-road
- Scooter
- Trike / three-wheeler
ATV /UTV
- ATV
- UTV
- Side-by-side (SxS)
RV
- Class A motor home
- Class B motor home
- Class C motor home
- Cargo & horse trailer
- Conventional trailers
- Fifth-wheel trailers
- Pop-up campers
- Truck campers
Boat
- Bass & fishing boats
- Pontoon boats
- Powerboats
- Personal watercraft (PWC)
- Sailboats
Color
Primary palette
Dusk blue and white are the predominant colors that represent the SL brand because they ladder up to the master Progressive brand. The muted blue represents the open sky and/or water.
Dusk
HEX: #91B0BF
RGB: 145, 176, 191
CMYK: 69, 43, 30, 4
PANTONE: 5405 C
75% tint
White
HEX: #FFFFFF
RGB: 255, 255, 255
CMYK: 0, 0, 0, 0
Black
HEX: #000000
RGB: 0, 0, 0
CMYK: 0, 0, 0, 100
Secondary palette
While the secondary palette isn't necessarily required to be used in every design, the bright pops of color speak to the fun had while using SL products...
Lake
HEX: #0077B3
RGB: 0, 119, 179
CMYK: 100, 47, 0, 0
PANTONE: 2935 C
Gravel
HEX: #585959
RGB: 88, 89, 91
CMYK: 0, 0, 0, 80
PANTONE: Black 75%
Ember
HEX: #EF5E15
RGB: 239, 94, 21
CMYK: 1, 78, 100, 0
PANTONE: 165
Sand
HEX: #F4F4ED
RGB: 244, 244, 237
CMYK: 0, 0, 3, 5
PANTONE: 7527 C
30% tint
Type
Headlines
96 Sans Bold
All lowercase
Lake, gravel, ember, or dusk
Subhead
96 Sans Medium
Sentence case
Dusk
Subhead 2
96 Sans Bold
Sentence case
Gravel
Body Copy
96 Sans Light
Sentence case
Gravel or black
No depreciation.
We pay full replacement costs on partial losses.
Personal effects.
We’ll pay the full cost (no depreciation) for personal items that are stolen or get damaged in and around your RV.
Welcome to Progressive's brand guidelines! Consider this your reference book whenever you're working on anything that carries the Progressive name. Because just like you, we have a reputation to uphold. And just like you, we want to make a great impression—every single time.
The Visuals
From logos to photography, keeping a consistent visual style ensures everything we create feels unmistakably Progressive.
The Voice
Our voice is like a neighbor on the front steps—easygoing, warm, and welcoming. Learn more about our tone and how we communicate.
The Business
Take a deeper dive into our business areas to get a good grasp on how Progressive shows up in different contexts.
Text call to action
You can designate the background color and the text color of this module. This is the body text area. Here's some body text. Our purpose statement guides everything we do at Progressive. It's the reason we exist in the world, and it guides how we think, create, and act.
1 Up Grid
The Progressive word mark and logotype variants give teams a controlled set of marks for common brand applications.
Recommended for a featured asset plus two alternates.
Full Width Item
Clear-space guidance helps keep the logo readable and prevents nearby elements from crowding the mark.
Best for diagrams, rules, and specifications.
3 Up Grid
Show teams what not to do by pairing each misuse example with a short explanation.
Designed for repeated three-up examples.
Do not change the logo’s orientation.
Do not alter the logo’s weight or shape.
Do not use unapproved colors.
Do not use the logo in a text block.
Do not repeat the logo in a pattern.
Do not violate the logo surround space.