feat(icon): add UserKey icon

[mittalyashu]

What is the purpose of this pull request?

• [x] New Icon
• [ ] Bug fix
• [ ] New Feature
• [ ] Documentation update
• [ ] Other:

Description

A user icon with key

Icon use case

It can be used to show user authentication or passkey

Alternative icon designs

Icon Design Checklist

Concept

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

Author, credits & license

• [x] The icons are solely my own creation.
• [ ] The icons were originally created in #<issueNumber> by @<githubUser>
• [x] I've based them on the following Lucide icons:
• [ ] I've based them on the following design:

Naming

• [ ] I've read and followed the naming conventions
• [ ] I've named icons by what they are rather than their use case.
• [x] 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 two 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[bot]]

Added or changed icons

Preview cohesion

Preview stroke widths

DPI Preview (24px)

Icon X-rays

[gruckion]

Prefer the example where the key is pointing down.When it is diagonal it is thinner and it doesn't look right.

[mittalyashu]

Here are few different variants of user-key icon with key being in different directions.

Zoomed-in

100%

---

Given the spacing and balancing the weight, I prefer the first icon.

[karsa-mistmere]

Given the spacing and balancing the weight, I prefer the first icon.

The body on the vertical variants seems unreasonably narrow, making the icon appear very off to the left. We should also take into consideration that a user-round-key variant will be needed, as well as consistency with other pre-existing icons such as file-key, folder-key, book-key etc.

The bottom row would have better centred visual weight horizontally:

[karsa-mistmere]

Here's a quick comparison of different variants affecting all of our -key icons, as well as two alternate solutions to make the current diagonal variant more legible:

https://www.figma.com/file/BKpQe5bYiI2IAX3MtCQbUa/lucide%2Fkey?type=design&node-id=0%3A1&mode=design&t=SkU2VswhjE61kUgB-1

[jguddas]

I feel like down looks the sleekest, but I wouldn't use it or top-right due to the venus(♀)/mars(♂) symbol similarity.

[karsa-mistmere]

I feel like down looks the sleekest, but I wouldn't use it or top-right due to the venus(♀)/mars(♂) symbol similarity.

Pardon my French, but what a load of poppycock, neither of those look the slightest like ♀️ or ♂️. 😆

[ericfennis]

I vote for the second or third row.

[ericfennis]

Reviewing this again, I would go for the second one. Since presenting and holding a key is mostly upward.

[ericfennis]

@mittalyashu What do you think?

[mittalyashu]

Agree, I will update the icon with the key facing upward.

[karsa-mistmere]

We would also need to update icons this was based on, otherwise the set will not be consistent.

[ericfennis]

@karsa-mistmere I prefer to do it in a separate PR. To keep it a bit scoped. Do you agree?

[karsa-mistmere]

@karsa-mistmere I prefer to do it in a separate PR. To keep it a bit scoped. Do you agree?

Um... not really, hence raising the issue that merging this without adjusting the other icons to match will result in an inconsistent icon set. At the very least let's make that PR first, review both, then merge both at the same time so that if anything blocks updating all other icons to this style we'll be aware of it before making a step in this direction.

[mittalyashu]

hence raising the issue that merging this without adjusting the other icons to match will result in an inconsistent icon set.

We can keep the existing icon set as-it-is.

I will create a new set of icons with the key variant facing upward.

What your take on this? @ericfennis @karsa-mistmere

[karsa-mistmere]

hence raising the issue that merging this without adjusting the other icons to match will result in an inconsistent icon set.

We can keep the existing icon set as-it-is.

I will create a new set of icons with the key variant facing upward.

What your take on this? @ericfennis @karsa-mistmere

Very much not in favour of adding an extra set of -key icons when we already have one too many file-key icons.

[ericfennis]

@karsa-mistmere Can you provide the designs (second row I think) to @mittalyashu, to make the set consistent? I'm also fine with creating separate PR, and merging PRs at the same time.

[karsa-mistmere]

@karsa-mistmere Can you provide the designs (second row I think) to @mittalyashu, to make the set consistent? I'm also fine with creating separate PR, and merging PRs at the same time.

I've already posted a Figma link in https://github.com/lucide-icons/lucide/pull/1848#issuecomment-1925633808