## Component

### Tech stack

- [Submit template](https://docs.croct.com/immersion/guides/publishing-templates)

-   
  **Globe**  
  A 3D globe to visualize global presence, activity, or reach.  
  [View Template](/content/templates/library/magic-ui/globe/index.html)

-   
  **Bento grid**  
  A modular grid layout for featuring content blocks, use cases, or product highlights.  
  [View Template](/content/templates/library/magic-ui/bento-grid/index.html)

-   
  **React phone number input**  
  A phone field formatted based on the user's location.  
  [View Template](/content/templates/interface/form/react-phone-number-input/index.html)

-   
  **Geomarketing strategy**  
  An announcement bar with a location-based message.  
  [View Template](/content/templates/use-case/location/geomarketing/index.html)

-   
  **Orbiting circles**  
  Animated circles orbiting a central element to represent relationships or connections.  
  [View Template](/content/templates/library/magic-ui/orbiting-circles/index.html)

-   
  **Hero video dialog**  
  A hero section with a video dialog to introduce or demo your product.  
  [View Template](/content/templates/library/magic-ui/hero-video-dialog/index.html)

-   
  **Dock**  
  A list of avatars to represent people, brands, or tools.  
  [View Template](/content/templates/library/magic-ui/dock/index.html)

-   
  **Video player**  
  Schema-only template for a video player component.  
  [View Template](/content/templates/interface/component/video-player/index.html)

-   
  **Animated list**  
  A list with animations to display notifications, updates, or events.  
  [View Template](/content/templates/library/magic-ui/animated-list/index.html)

-   
  **Navbar**  
  A navbar using Material UI components and Croct.  
  [View Template](/content/templates/library/material-ui/navbar/index.html)

-   
  **Avatar circles**  
  A list of avatars to represent people, brands, or tools.  
  [View Template](/content/templates/library/magic-ui/avatar-circles/index.html)

-   
  **Tweet card**  
  A styled tweet embed to highlight social proof or share updates.  
  [View Template](/content/templates/library/magic-ui/tweet-card/index.html)

```shellcmd
npx croct@latest init
```