Coming up with icon variant naming scheme rules

[YanikKendler]

The Folder and File search variants have confilicting naming schemes

Current names:

• Folder with search icon in the corner: folder-search
• Folder with search icon in the center: folder-search-2
• File with search icon in the corner: file-search-corner
• File with search icon in the center: file-search
• Book with search icon in the corner: book-search

These patterens are followed by all file variants, using -corner for corner placement like file-code or file-braces.

My suggestion would be to treat the corner as the default.

Suggested names:

• Folder with search icon in the corner: folder-search
• Folder with search icon in the center: folder-search-center
• File with search icon in the corner: file-search
• File with search icon in the center: file-search-center
• Book with search icon in the corner: book-search

Alternatively both "center" variants could be renamed to XY-search-2 if numbering is preferred but this would be less easily distinguishable.

There is also an issue with the "secondary icon" sometimes being placed in the bottom left and sometimes the bottom right, almost arbitrarily. Also many variants only have centered or only corner variants like folder-heart (corner only) and folder-code (center only) but that level of consitency would require a large scale rework of many icons as well as a full list of required changes and missing variants. This should be its own issue if the maintainers feel that this should be fixed.

[jguddas]

Yeah, we have thought about it, but haven't really come to a decision.

There are basically 2 options:

1. Have a default placement (i.e. center for example, and then the corner bottom right variant is always -corner, and anything else is -corner-top-right, etc.).
2. Always be explicit, a variant always specifies its placement (i.e. -corner-bottom-right, -center, -corner-top-right).

Or a mix of the two.

[karsa-mistmere]

Yeah, we have thought about it, but haven't really come to a decision.

Well, not quite, we've definitely come to the decision to not support the *-2 naming scheme, which this issue proposes as an alternative:

Alternatively both "center" variants could be renamed to XY-search-2 if numbering is preferred but this would be less easily distinguishable.

So no, this is no go, see naming convention no. 5 at https://lucide.dev/contribute/icon-design-guide#naming-conventions

But yeah, as @jguddas has stated, we have just not got around to renaming everything, which is fine. We can rename them organically on a case by case basis once we figure out what the rules should be, but we're not quite sure yet which of these to go with:

• [shape]-[variant]-corner & [shape]-[variant] (implicit center)
• [shape]-[variant]-center & [shape]-[variant] (impicit corner)
• [shape]-[variant]-center & [shape]-[variant]-corner

We're also not quite sure whether this naming scheme should be universal across all icons or should be different for different subsets of icons (e.g. file-[variant] (implicit center) & file-[variant]-corner, but folder-[variant]-center & folder-[variant] (implicit corner)).

The toughest nut to crack here will be coming up with a clear ruleset why and which naming convention to follow in the future, and applying that to existing icons that do not match this. 😅

[YanikKendler]

After taking another look at existing icons think the only sensible thing is to always specifiy the position of the sub-element.

My proposal for a naming convention is the following

[element]-[modifier]-[sub-element]-[sub-element-modifier]-[sub-element-position]

• element : the primary icon e.g. square
• modifier : any property of the primary icon e.g. square-dashed, bluetooth-connected
• sub-element: any secondary icon e.g. square-user
• sub-element-modifier: any property of the secondary icon e.g. square-user-round
• sub-element-position: where the sub element is located e.g. square-user-round-center

Aditional rules:

• The sub-element-position is required for every sub element
• The sub element pattern could be repeated further if multiple sub elements are present
• The preferred corner for a sub element is the bottom right corner unless the primary element does not allow it
• If a sub element is included both a corner and a center variant should be provided

I might have forgotten something but I believe this takes care of most cases :)