Lanyard

Create interactive 3D lanyard cards that swing and move realistically. Perfect for digital business cards, event badges, and unique card presentations.

Create a Lanyard

What is a Lanyard?

A Lanyard project creates an interactive 3D card hanging from a ribbon, like a conference badge or ID card. The card swings naturally when viewers interact with it, creating an engaging experience.

  • Realistic physics-based swinging motion
  • Customizable card image and colors
  • AI-powered image generation
  • Adjustable ribbon colors
  • Works on all devices

Best use cases

Digital Business Cards

Stand out with a memorable 3D presentation

Event Badges

Virtual conference or event credentials

ID Cards

Employee or member identification

Membership Passes

Club or organization membership cards

VIP Passes

Exclusive access credentials

Artist Passes

Backstage or artist credentials

Creating a Lanyard

Step 1: Upload or generate card image

In the Content tab, you have two options:

Upload an image

Drag and drop or browse to upload your card image. For best results, use a 4:3 aspect ratio image.

AI image generation

Describe what you want and our AI will generate a card image for you. No design skills needed!

The AI image generator works best with clear, descriptive prompts. Try: "Professional business card with blue gradient background, modern minimalist design"

Step 2: Customize card appearance

Adjust the card settings:

  • Card Background Color: The color behind your image
  • Texture Offset: Fine-tune image positioning (X and Y)
  • Texture Scale: Zoom in or out on your image

Step 3: Customize the ribbon

In the Appearance tab, change the ribbon color to match your branding or event theme.

Step 4: Add navigation links

Use the Links tab to add a floating dock with links to your website, social profiles, or contact info.

AI image generation

The AI tool helps you create professional card designs without any design skills:

  1. Click the AI generation button in the Content tab
  2. Enter a description of the card you want
  3. Click Generate and wait a few seconds
  4. The generated image appears on your card
  5. Regenerate if you want a different result

Prompt tips

  • Be specific about colors: "blue and white" instead of just "professional"
  • Mention the style: "minimalist", "modern", "vintage", "corporate"
  • Include content details: "with company logo space at top"
  • Specify the purpose: "conference badge", "business card", "VIP pass"

Lanyard settings

Ribbon color

Change the color of the lanyard ribbon. Match it to your brand or event colors.

Background

Set a solid color, gradient, or image as the scene background. This appears behind the hanging lanyard.

Navigation dock

Add links and zoom buttons to the floating dock. Configure position, style, and visibility in the Links tab.

Zoom buttons

Enable zoom controls in the dock so viewers can get a closer look at your card.

How viewers interact

The lanyard responds to viewer interactions:

Mouse/Touch Drag

Click and drag the card to make it swing. Release to let it settle naturally.

Automatic motion

The card gently sways on its own, creating a dynamic presentation.

Zoom

Use zoom buttons or pinch gestures to examine the card closely.

Dock links

Click links in the navigation dock to visit external pages or see modal content.

Tips for great Lanyards

  • Use high-resolution images for crisp card display
  • Keep important content centered (edges may be clipped)
  • Match ribbon color to your brand for cohesive look
  • Add dock links to your website, LinkedIn, or portfolio
  • Use AI generation for quick professional designs
  • Test the swinging interaction before sharing

Related documentation