The SUSE Design System uses cookies to help us learn more about how we can improve the design system.
Learn more about our cookie policy

Didn’t find the component you were looking for? Take a look on what’s coming next or contact us.
Looking for components? what’s next or contact us.
EOS Design System logotype


Information related to how to implement links and how to choose the right color.

Link colors

The darkest shade (900) of the Cerulean color is the default color for links. Link text is bold.

For mouse hover, use an underline.



This is the default link color

Special use case

When the color contrast fails between $eos-bc-cerulean-900 and the elements background, the link color remains the same as the text color, dark grey or white. The link text is bold and underlined. Remove the underline on mouse hover.

Remove the underline on mouse hover.



Link on colored backgrounds.



Link on colored backgrounds.