Usage Guidelines
Only core components such as Buttons or Typography should depend directly on the colors component. Higher level components should get their colors indirectly from the core set of components. This makes it easy to update the color usage across the library.
This is the "Primary" color used in the UI, its used in the Primary Button to show emphasis beyond the default grey buttons.
This is the darker counter-part color to Marine Blue, used for strokes and hover states, its used mainly with Marine Blue.
This is the "Default" color used in the UI, its used in the Default Button.
This is the darker counter-part to Gallery, this is used in hover states for default elements.
This is the default stroke color, its a bit darker thant Alto to make sure its easy to see in different element states
This is the Cloudflare Orange. Other than the logo we don't really use this in our dashboard. The color is more prevalent in the marketing website.
This is Cloudflare's lighter yellow-orange. Only used in the logo and marketing materials.
This is the main "black" color for Cloudflare, used primary in text.
This is the lighter "black" color for accent text and UI elements.
Sub title - Lorem Ipsum is great
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
This is the main "Warning" color for Cloudflare, used primary in text, buttons, and other elements in the dashboard when we want to make sure users are warned of making any potentially removing/ deleting/break-their-site actions.
This is the darker counter-part for Tall Poppy. For states like hover and focus etc.