Default link
The European Commission is the executive of The European Union and promotes its general interest.
<p class="ecl-u-type-paragraph">The European Commission is the executive of <a href="/example" class="ecl-link">The
European Union</a> and promotes its general interest.</p>Try it yourself on the playground
PlaygroundStandalone link
<a href="/example" class="ecl-link ecl-link--standalone">Standalone link</a>Try it yourself on the playground
PlaygroundLink with icon
Note: all types of links listed on this page can have icons before or after the label.
The European Commission is the executive of The European Unionand promotes its general interest.
<p class="ecl-u-type-paragraph">The European Commission is the executive of <a href="/example"
class="ecl-link ecl-link--default ecl-link--icon ecl-link--icon-after"><span class="ecl-link__label">The European
Union</span><svg class="ecl-icon ecl-icon--fluid ecl-link__icon" focusable="false" aria-hidden="false" role="img">
<title>Links to an external domain</title>
<use xlink:href="/dist/media/icons.16df4a0c.svg#external"></use>
</svg></a> and promotes its general interest.</p>Try it yourself on the playground
PlaygroundCall-to-action link
<a href="/example" class="ecl-link ecl-link--cta">Call to action link</a>Try it yourself on the playground
PlaygroundPrimary link
<a href="/example" class="ecl-link ecl-link--primary">Primary link</a>Try it yourself on the playground
PlaygroundSecondary link
<a href="/example" class="ecl-link ecl-link--secondary">Secondary link</a>Try it yourself on the playground
PlaygroundNegative link
The European Commission is the executive of The European Union and promotes its general interest.
<p class="ecl-u-type-paragraph ecl-u-bg-blue-100 ecl-u-type-color-white-100">The European Commission is the executive of
<a href="/example" class="ecl-link ecl-link--negative">The European Union</a> and promotes its general interest.</p>Try it yourself on the playground
Playground