Can I change an underline’s colour?

Yes. You can recolour an element on the page and change its stroke width, size, opacity and rotation.

How can I download an underline?

You can copy the SVG code or export PNG, WebP, JPG, CSS, a React component or a data URI.

Can I use these underlines in a commercial project?

Pro and Max accounts get a commercial licence for what they download. Free items are available for personal projects with a free account.

Free underline SVG elements

18 SVGs

Search the library

Browse free underline SVG elements for text, headings and links. Use an underline to mark a key phrase in a page title, separate a section heading from body text, or draw attention to a link. Each element is real SVG code, made by AMNT’s own models and checked by a judge before publication. You can use free items in personal projects with a free account.

Recolour an underline on this page, or recolour the whole grid while you compare options. You can also change stroke width, size, opacity and rotation. When you are ready, copy the SVG code or export CSS, PNG, WebP, JPG, a React component or a data URI. Icons drawn with currentColor take the colour of the text around them.

underline stroke rule swoosh loop short arrow arch dots sweep brush curve

Packs

Sets drawn in one style.

Underlines, flat

18 SVGs · Free 11 · Premium 7

Not what you need?

Describe it: the SVG studio opens with this style filled in.

More elements

Questions

Can I change an underline’s colour?: Yes. You can recolour an element on the page and change its stroke width, size, opacity and rotation.
How can I download an underline?: You can copy the SVG code or export PNG, WebP, JPG, CSS, a React component or a data URI.
Can I use these underlines in a commercial project?: Pro and Max accounts get a commercial licence for what they download. Free items are available for personal projects with a free account.