feat(icon): add globe-x icon with metadata

[Muhammad-Aqib-Bashir]

Description

This pull request adds a new globe-x icon. It represents offline status, loss of connectivity, or a failed internet connection. The update includes the SVG icon and its corresponding metadata file.

closes #3750

Icon use case

• Indicating that a device or application is offline or cannot reach the internet.
• Displaying network errors in dashboards, connectivity indicators, or system settings panels.
• Representing failed synchronization or unavailable online features.
• Showing offline mode in mobile or desktop applications.

Alternative icon designs

No alternative versions were necessary for this icon. The current version follows the standard Lucide visual structure by combining the existing globe-style geometry with a simple overlay cross to indicate a disconnected state.

Icon Design Checklist

Concept

• I have provided valid use cases for this 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 icon is solely my own creation.

Naming

• I've read and followed the naming conventions.
• I've named the icon based on what it is rather than its use case.
• I've provided the meta JSON file in icons/globe-x.json.

Design

• I've read and followed the icon design guidelines.
• I've made sure that the icon looks sharp on low DPI displays.
• I've made sure that the icon looks consistent with the icon set in size, optical volume and density.
• I've made sure that the icon is visually centered.
• I've correctly optimized the icon 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

Icons as code

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

const GlobeXIcon = createLucideIcon('GlobeX', [
  ["path",{"d":"m15.5 10.5 6-6"}],
  ["path",{"d":"M15.686 15A14.5 14.5 0 0 1 12 22a14.5 14.5 0 0 1 0-20 10 10 0 1 0 9.542 13"}],
  ["path",{"d":"M2 12h9"}],
  ["path",{"d":"m21.5 10.5-6-6"}]
])

[karsa-mistmere]

Hey @Muhammad-Aqib-Bashir,

We should probably use the same 5 by 5 x as in pretty much all our other icons:

Open lucide studio

[Muhammad-Aqib-Bashir]

Hi @karsa-mistmere,

This is a valid and great point which confused me too. however, I tried to make it similar to globe-lock that already exists.