Skip to main content

Logo Upload and Management

beginnerLast updated: 1/15/2024

Upload, manage, and optimize your host organization's logo

Logo Upload and Management

Upload and manage your host organization's logo. Your logo is a key part of your brand identity and appears throughout the platform.

Logo Requirements

File Formats

Supported formats:

  • PNG (recommended): Best for logos with transparency
  • SVG (recommended): Scalable vector graphics, perfect quality at any size
  • JPG/JPEG: Use only if PNG/SVG not available

Size and Dimensions

  • Minimum Size: 256x256 pixels
  • Recommended Size: 512x512 pixels or larger
  • Aspect Ratio: Square (1:1) works best
  • File Size: Under 2MB recommended for fast loading

Design Guidelines

  • Transparent Background: Use PNG with transparency for best results
  • Readable at Small Sizes: Ensure logo is clear when scaled down
  • High Quality: Use high-resolution source files
  • Simple Design: Complex logos may not display well at small sizes

Before uploading:

  1. Ensure logo is in PNG, SVG, or JPG format
  2. Resize to at least 512x512 pixels (if raster image)
  3. Optimize file size (compress if needed)
  4. Test logo on both light and dark backgrounds

Step 2: Access Logo Settings

  1. Navigate to Host Settings
  2. Go to the "Logo" section
  3. You'll see the current logo (if one exists) and upload controls
  1. Click "Upload Logo" or "Choose File"
  2. Select your logo file from your computer
  3. Wait for upload to complete
  4. Preview the logo in the preview area

Step 4: Save

  1. Review the logo preview
  2. Ensure it looks correct
  3. Click "Save" to apply the logo
  4. Logo will appear on public pages immediately

Logo Display Locations

Your logo appears in:

  • Navigation Bar: Top of all pages, typically left side
  • Landing Page Hero: Large display in hero section
  • Tournament Cards: Small logo on tournament listings
  • Team Pages: Host logo on team information pages
  • Email Notifications: Logo in email headers (if configured)
  • Admin Dashboard: Logo in host selection and management areas

To replace an existing logo:

  1. Navigate to Host Settings
  2. Go to Logo section
  3. Click "Upload Logo" or "Change Logo"
  4. Select new logo file
  5. Preview the new logo
  6. Click "Save" to replace

The old logo will be replaced immediately.

To remove your logo:

  1. Navigate to Host Settings
  2. Go to Logo section
  3. Look for "Remove Logo" or "Delete" option
  4. Confirm removal
  5. Save changes

Note: Removing the logo will use a default placeholder or text in logo locations.

Logo Optimization Tips

File Size

  • Compress PNG files using tools like TinyPNG
  • Use SVG format when possible (smaller file size, scalable)
  • Optimize JPG quality (85-90% is usually sufficient)

Image Quality

  • Use high-resolution source files
  • Export at 2x the display size for retina displays
  • Maintain aspect ratio when resizing

Format Selection

  • PNG: Best for logos with transparency or text
  • SVG: Best for simple logos, perfect scaling
  • JPG: Only if transparency not needed and file size is critical

Best Practices

Design

  • Keep logo simple and recognizable
  • Ensure it works on both light and dark backgrounds
  • Test at various sizes (small nav icon to large hero)
  • Maintain brand consistency

Technical

  • Use transparent backgrounds when possible
  • Optimize file size without sacrificing quality
  • Use appropriate format (PNG for transparency, SVG for scalability)
  • Test logo display on different devices

Branding

  • Use official logo files
  • Maintain consistent logo usage
  • Follow brand guidelines if available
  • Update logo if rebranding

Troubleshooting

Logo Not Uploading

  • Check file format (PNG, SVG, or JPG)
  • Verify file size is under 2MB
  • Ensure you have upload permissions
  • Try a different browser
  • Check internet connection

Logo Looks Blurry

  • Upload a higher resolution version
  • Use SVG format for perfect scaling
  • Ensure source file is high quality
  • Check if image was compressed too much

Logo Not Displaying

  • Verify upload completed successfully
  • Clear browser cache and refresh
  • Check if logo was saved
  • Verify file format is supported

Wrong Size or Aspect Ratio

  • Use square (1:1) aspect ratio for best results
  • Upload at least 512x512 pixels
  • Logo will be automatically resized to fit
  • Consider redesigning if aspect ratio is very different

Logo Guidelines by Use Case

Navigation Bar

  • Small size (typically 32-48px height)
  • Simple design that's readable small
  • Works on various background colors

Hero Section

  • Large size (typically 200-400px)
  • Can be more detailed
  • High impact, brand showcase

Cards and Listings

  • Medium size (typically 64-128px)
  • Balanced detail and simplicity
  • Consistent with other branding
Tags:host-managementlogobrandingimages

Was this article helpful?