feat(icons): added tag-plus and tag-x icons

[adam-kov]

Description

Added new tag-plus and tag-x icons.

Icon use case

• More everyday object icons should have plus, x, edit, etc. variations.
• I mark the "Products" menu in my application with the tag icon. Users can add products, so I'd rather use the tag-plus icon in the "New product" button instead of the generic plus one.
• For the same reason, I'd like to have the tag-x icon for deleting a product.

Alternative icon designs

Icon Design Checklist

Concept

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

Author, credits & license

• The icons are solely my own creation.
• The icons were originally created in # by @
• I've based them on the following Lucide icons: tag, plus, x
• 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.
• 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]

🤖 ChatGPT Tags suggestions ✨

I've asked ChatGPT for some suggestions for tags.

[github-actions]

Added or changed icons

Preview cohesion

Preview stroke widths

DPI Preview

16px (shadcn/ui)

24px (default)

32px (shadcn/ui + retina)

48px (default + retina)

Icon X-rays

Icon Diffs

Icon Symmetry

Flip Horizontal

Flip Vertical

Flip Diagonal

Rotate 180°

Icons as code

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

const TagPlusIcon = createLucideIcon('TagPlus', [
  ["path",{"d":"M16 13h6"}],
  ["path",{"d":"m16.5 6.5-3.914-3.914A2 2 0 0 0 11.172 2H4a2 2 0 0 0-2 2v7.172a2 2 0 0 0 .586 1.414l8.704 8.704a2.426 2.426 0 0 0 3.42 0l1.79-1.79"}],
  ["path",{"d":"M19 10v6"}],
  ["circle",{"cx":"7.5","cy":"7.5","r":".5","fill":"currentColor"}]
])

const TagXIcon = createLucideIcon('TagX', [
  ["path",{"d":"m16.5 6.5-3.914-3.914A2 2 0 0 0 11.172 2H4a2 2 0 0 0-2 2v7.172a2 2 0 0 0 .586 1.414l8.704 8.704a2.43 2.43 0 0 0 3.42 0l1.79-1.79"}],
  ["path",{"d":"m16.5 10.5 5 5"}],
  ["path",{"d":"m21.5 10.5-5 5"}],
  ["circle",{"cx":"7.5","cy":"7.5","r":".5","fill":"currentColor"}]
])

[karsa-mistmere]

Hey @adam-kov,

Overall really nice work on this, I have but one qualm: as per #3875 the cross should be our 5by5 variant, positioned in the same way as folder-x is relative to folder-plus.

[karsa-mistmere]

Ah, one small issue that's only just occurred to me: @jguddas already has an ongoing pull request changing the base shape of tag in #3936 I'd rather we wait for that one to get merged before we add any more variants. 😅

[adam-kov]

Still waiting for #3936.

[ericfennis]

@karsa-mistmere @jguddas, since a debate is still going on in #3936. Maybe add this one first?

[karsa-mistmere]

@karsa-mistmere @jguddas, since a debate is still going on in #3936. Maybe add this one first?

I'm fine with that, just as long as main remains in a consistent state.

[jguddas]

My vote is for bigger tlx an plus, the more legible the better

[karsa-mistmere]

My vote is for bigger tlx an plus, the more legible the better

Not terrible in this particular instance, but I'm still voting not to break the consistency of the entire icon set:

[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.

[adam-kov]

Not stale