feat(icons): Add gender icons

[jamiemlaw]

closes #560

What is the purpose of this pull request?

• New Icon
• Bug fix
• New Feature
• Documentation update
• Other:

Description

Adds a variety of gender icons:

• mars (male)
• venus (female)
• venus-and-mars (intersex, androgynous, hermaphrodite)
• mars-stroke (androgyne, transgender, possibly "other gender")
• transgender (transgender, gender inclusivity)
• nonbinary
• circle-small (genderless)
• neuter

Care has gone into submitting the fewest number of icons to be gender-inclusive, without being overwhelming. It is important to note that these icons represent genders, not gender identities; the latter are too numerous, and too specific for this icon library. This PR also does not include sexual orientations, which, while similar to gender, are a distinct concept, and therefore out of scope. If there is demand, it can be raised separately.

Other icons that are intentionally not included:

• mercury (historically used for intersex, but since replaced by venus-and-mars)
• mars-stroke-right and mars-stroke-up (too similar to mars-stroke in design, not referenced in the Wikipedia article for gender symbols)

Icon use case

• For all icons: personal profiles
• For mars, venus and venus-and-mars: the biological sex of a person, animal or plant
• For mars, venus and neuter: grammatical gender of a noun
• For venus-and-mars, mars-stroke, nonbinary, circle-small, transgender, neuter: ways to express a person's gender beyond male and female
• For transgender: to denote gender inclusivity (all genders)
• For circle-small: a bullet point

Alternative icon designs

Icon Design Checklist

Concept

• I have provided valid use cases for each icon.
• I have not added any a brand or logo icon.
• I have not used any hate symbols.
• I have not included any religious or political imagery.

Author, credits & license

• The icons are solely my own creation.
• The icons were originally created in Gender icons #560 by @jguddas
• I've based them on the following Lucide icons:
• I've based them on the following designs: Wikipedia article for Gender Symbol

Naming

• I've read and followed the naming conventions
• I've named icons by what they are rather than their use case.
• I've provided meta JSON files in icons/[iconName].json.

Design

• I've read and followed the icon design guidelines
• I've made sure that the icons look sharp on low DPI displays.
• I've made sure that the icons look consistent with the icon set in size, optical volume and density.
• I've made sure that the icons are visually centered.
• I've correctly optimized all icons to three points of precision.

Before Submitting

• I've read the Contribution Guidelines.
• I've checked if there was an existing PR that solves the same issue.

[github-actions]

Added or changed icons

Preview cohesion

Preview stroke widths

DPI Preview (24px)

Icon X-rays

Icon Diffs

Icons as code

Works for: lucide-react, lucide-react-native, lucide-preact, lucide-vue-next

const CircleSmallIcon = createLucideIcon('CircleSmall', [
  ["circle",{"cx":"12","cy":"12","r":"6"}]
])

const MarsStrokeIcon = createLucideIcon('MarsStroke', [
  ["path",{"d":"m14 6 4 4"}],
  ["path",{"d":"M17 3h4v4"}],
  ["path",{"d":"m21 3-7.75 7.75"}],
  ["circle",{"cx":"9","cy":"15","r":"6"}]
])

const MarsIcon = createLucideIcon('Mars', [
  ["path",{"d":"M16 3h5v5"}],
  ["path",{"d":"m21 3-6.75 6.75"}],
  ["circle",{"cx":"10","cy":"14","r":"6"}]
])

const NonBinaryIcon = createLucideIcon('NonBinary', [
  ["path",{"d":"M12 2v10"}],
  ["path",{"d":"m9 4 6 4"}],
  ["path",{"d":"m9 8 6-4"}],
  ["circle",{"cx":"12","cy":"17","r":"5"}]
])

const TransgenderIcon = createLucideIcon('Transgender', [
  ["path",{"d":"M12 16v6"}],
  ["path",{"d":"M14 20h-4"}],
  ["path",{"d":"M18 2h4v4"}],
  ["path",{"d":"m2 2 7.17 7.17"}],
  ["path",{"d":"M2 5.355V2h3.357"}],
  ["path",{"d":"m22 2-7.17 7.17"}],
  ["path",{"d":"M8 5 5 8"}],
  ["circle",{"cx":"12","cy":"12","r":"4"}]
])

const VenusAndMarsIcon = createLucideIcon('VenusAndMars', [
  ["path",{"d":"M10 20h4"}],
  ["path",{"d":"M12 16v6"}],
  ["path",{"d":"M17 2h4v4"}],
  ["path",{"d":"m21 2-5.46 5.46"}],
  ["circle",{"cx":"12","cy":"11","r":"5"}]
])

const VenusIcon = createLucideIcon('Venus', [
  ["path",{"d":"M12 15v7"}],
  ["path",{"d":"M9 19h6"}],
  ["circle",{"cx":"12","cy":"9","r":"6"}]
])

[github-actions]

This PR is stale because it has been open 45 days with no activity. Remove stale label or comment or this will be closed in 5 days.

[ericfennis]

Not sure about adding the neuter icon. I think this one is a bit too specific and I doubt if it will be used that much, I think this one is more for the Lab project to research the use.

[jguddas]

Not sure about adding the neuter icon. I think this one is a bit too specific and I doubt if it will be used that much, I think this one is more for the Lab project to research the use.

A use case besides the obvious veterinarian healthcare context would be electrical neutral.

[jamiemlaw]

Not sure about adding the neuter icon. I think this one is a bit too specific and I doubt if it will be used that much, I think this one is more for the Lab project to research the use.

My main justification for originally including it was that it appeared on the Wikipedia article for gender symbols; and, unlike for the Mercury symbol, gave no indication that it was superseded by something different. I think it is used in botany.

However, I agree that its use case might be more niche than the others, and I'd be happy to get rid of it, knowing we could always add it in later if there is demand for it. Or it could go into `lab'.

[jguddas]

Suggested change

	"gender"
	"bigender",
	"demigender",
	"enby",
	"gender",
	"genderfluid",
	"multigender",
	"nonbinary",
	"pangender",
	"plumbus",
	"polygender",
	"queer",
	"sex",
	"transexual",
	"transfeminine",
	"transgender",
	"transmasculine",
	"two-spirit",
	"xenogender"

[jamiemlaw]

That's getting into the weeds of specific gender identities, which I was hoping to avoid. I can foresee two general problems if we went down that route:

• Such a list of tags will never be complete and always open to debate.
• Some of those terms have their own specific icons; a user searching for, say, "pangender" might conclude that we got the icon incorrect, or that we think the symbols are interchangeable.

I'm happy with adding the un-hyphenated "nonbinary" as well as "enby" though.