Link

Links are blue and underlined by default so that they are immedately recognizable as such. If your link is at the end of a sentence or paragraph, make sure that the linked text does not include the full stop.

This component is a regular styled html a tag which has several priorities:

In case you need your own link component you will have to apply Link styles to it.

Here is an example of how you can do this:

import styled from "styled-components";
import StyledLink from "@finanzchef24gmbh/design-system/Link";
import { Link as ReactRouterLink } from "react-router-dom";

const Link = (props) => <StyledLink {...props} as={ReactRouterLink} />;

export default Link;

Links with Icons

You can add icons to the Link component, all what you need to do is add the icon element to the icon prop You can also set the icon position by passing the iconPosition prop

Links In Text

You can add icons to the Link component, all what you need to do is add the icon element to the icon prop

Props