Wordmark for light backgrounds
Use in light mode app chrome, landing pages, and white or near-white cards.
logo-with-text-dark.svg
Brand & Logo
Use the current My Trainer Connect mark and wordmark assets from the live app. The design library shell and home page should never fall back to the old cyan-only MTC mark.
Wordmark for dark backgrounds
Use in dark mode shell, keynote decks, dark cards, and internal presentation surfaces.
logo-with-text-light.svg
Mark for light backgrounds
Use only when the product context already says My Trainer Connect.
logo-mark-dark.svg
Mark for dark backgrounds
Use in compact sidebars, favicons, and keynote covers.
logo-mark-light.svg
Usage Rules
The logo system is simple because the app needs to feel stable, premium, and trustworthy.
Use contrast-matched assets
Dark asset on light surfaces, light asset on dark surfaces. Do not recolor inline.
Prefer the wordmark
Use the full wordmark unless the surrounding UI already provides context.
No fake legacy marks
Avoid old cyan-only logo treatments that do not match the current app assets.