Light Dark System

Gender Trans icon

gender-trans

The transgender symbol, a circle with the male arrow, the female cross and a struck-through arrow, for gender fields and LGBTQ+ topics.

Missing from Heroicons, where it was requested with 17 votes in #724 and #1402 .

Component: GenderTransIcon
Intended size: 24×24 px, 1.5 px stroke
Iconset: Sidekickicons
Keywords: transgender, trans, nonbinary, lgbt, lgbtq, pride, gender identity, gender

Outline 24×24 px, 1.5 px stroke Solid 24×24 px, solid fill Mini 20×20 px, solid fill Micro 16×16 px, solid fill

Code

<svg xmlns="http://www.w3.org/2000/svg" stroke-width="1.5" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true" data-slot="icon" fill="none" class="size-6">
  <path stroke-linecap="round" stroke-linejoin="round" d="M8.25 12a3.75 3.75 0 1 0 7.5 0 3.75 3.75 0 1 0-7.5 0Zm6.402-2.652L20.25 3.75m-3 0h3v3M9.348 9.348 3.75 3.75m3 0h-3v3M6 8.25 8.25 6M12 15.75V21m-2.25-2.25h4.5" />
</svg>

Gender Trans icon in UI elements

Button · Mini

Secondary button · Mini

Icon buttons · Mini, and an Outline toggle that turns Solid

Input · Mini

Navigation · Outline

Trans Trans

Badges · Micro

Gender Trans icon

Code

Gender Trans icon in UI elements

Related icons

More Sidekickicons