Skip to main content

Avoid logos that dominate the header (Admin Panel)

Learn how to fix a practice logo that fills or overwhelms the app header so your branding looks balanced on every screen.

Overview

When a logo file has little transparent padding, uses a square or stacked layout, or is placed inside a colored shape, it can dominate the app header and crowd navigation elements. This article explains common causes and how to re-export and re-upload a logo that displays at the right scale.

This article is for practice owners, managers, and admins troubleshooting logo display after uploading branding in the App Builder.

Before You Start

  • You must have Administrator or Manager access to edit App Builder content.

  • Open App Builder in the left-side navigation, then the Home screen editor.

  • Review logo specs in Asset guide (Admin Panel):

    • Minimum height: 366px

    • File type: PNG (transparent background recommended)

    • Max file size: 1MB

  • Have a design tool available (Canva, Photoshop, Figma, or similar) to re-export your logo if needed.

Why It Matters

A logo that dominates the header:

  • Reduces usable screen space for patients browsing your app.

  • Looks unpolished compared to practices with properly scaled branding.

  • Can obscure navigation on smaller phone screens.

  • Undermines trust if the first screen feels cramped or unbalanced.

How It Works

How RepeatMD scales logos. The app fits your uploaded logo into a fixed header area. The logo file’s aspect ratio and transparent padding determine how large it appears. Files with tight crops or tall aspect ratios scale up to fill available height, which makes the logo look oversized.

Common causes of oversized logos:

  • Square or stacked (vertical) logo instead of a horizontal wordmark

  • Logo placed inside a colored box or circle in the image file

  • Little or no transparent padding around the artwork

  • Full-bleed export where the logo touches all edges of the canvas

Fix approach: Re-export a horizontal logo with generous transparent padding, then re-upload in App Builder.

Step-by-Step Instructions

Diagnose the problem

  1. Log in to your Admin Panel.

  2. Click App Builder, then open the Home screen editor.

  3. Review the logo in the app preview panel.

  4. Check whether the logo is square, stacked, or inside a colored shape in your source file.

Re-export your logo with proper padding

  1. Open your logo source file in your design tool.

  2. Use a horizontal version of your logo (wordmark preferred for in-app headers).

  3. Remove any colored background shape unless it is part of your official brand lockup.

  4. Add transparent padding on all sides so the logo does not touch the canvas edges.

  5. Export as PNG with transparent background.

  6. Confirm the exported file meets the 366px minimum height requirement.

Re-upload in App Builder

  1. Return to App Builder → Home screen editor.

  2. Under Logo, click the upload area and select your re-exported file.

  3. Preview the header again. Repeat export with more padding if the logo still looks too large.

  4. Save your changes.

Best Practices and Pro Tips

  • Use a horizontal wordmark for in-app headers. Save square or icon-only versions for app icons and social profiles.

  • Leave breathing room. Transparent padding is the most reliable way to control header scale.

  • Do not embed the logo in a colored shape unless that shape is part of your brand standards.

  • Ask for help early. Your Client Experience Manager can resize a problem logo before launch.

  • Pair with the too-small guide. If padding fixes the scale but the logo looks faint, see Avoid logos that display too small (Admin Panel).

Common Mistakes and FAQs

Q: My logo looked fine on our website. Why is it too big in the app?

A: Website headers and mobile app headers use different aspect ratios. Export a horizontal version with transparent padding specifically for RepeatMD.

Q: Can RepeatMD resize my logo for me?

A: Your Client Experience Manager can help optimize logo files during onboarding. After launch, re-export and re-upload following the steps above, or email support@repeatmd.com for assistance.

Q: Should I use a square logo in the header?

A: Square and stacked logos often scale too large in the header. Use a horizontal wordmark for best results.

Q: What if my logo still dominates the header after re-export?

A: Add more transparent padding on the left and right sides of the file, then re-upload. If the issue persists, contact support@repeatmd.com with your logo file attached.

Next Steps and Support

Need help? Email support@repeatmd.com

Did this answer your question?