Logo branding

Your users see your logo and your product name at the left of the editor's bar, where ours would be. The editor then reads as part of your product, with nothing of Lettrove's in view ("Powered by Lettrove" is off unless you turn it on).

You set them once, in your project's settings, with no code. They apply to every editor the project opens, in every framework, with test keys and live keys alike. Every project can set them.

Your colours, font and corners are the other half of your brand; they go in your code, on Branding.

Set your logo and product name

1. Sign in at lettrove.com and go to Settings → Embed.
2. Open your project. Each project has its own branding.
3. In Branding, type your Product name: the name your users know you by, up to 60 characters.
4. Add your Logo, in one of two ways:
   • Upload an image: PNG, JPEG, GIF, WebP or SVG. We host it for you, so it keeps working whatever happens to your own servers.
   • Or paste a link to a logo your product already hosts, such as https://cdn.acme.com/logo.svg.
5. Check the Preview. It draws the bar exactly as your users will see it, at the same size.
6. Click Save branding.

An editor that opens after you save shows it. One already open keeps what it opened with until it next opens, so nobody's screen changes under them. Saving again replaces it; leave a field empty and save to show no name, or no logo.

What a logo needs

The shape that reads best is a wide logo, about 24 pixels tall. The bar draws it at most 24px tall and 160px wide, keeping its proportions, so:

Your logo	How it shows
Wide wordmark, e.g. 480 × 72	Fills the space: 160 × 24
Square icon, e.g. 512 × 512	24 × 24, with your product name beside it
Very wide, e.g. 1200 × 60	160 × 8: too small to read. Crop the empty space around it

With a square icon, set the product name too, so the bar shows your icon and name together. With a wordmark that already says your name, you can leave the name empty.

Light and dark mode. The editor follows your user's light or dark setting (see Branding), and your logo sits on whichever background is showing. An SVG, or a PNG with a transparent background, looks right on both. A dark logo can disappear on a dark editor: switch lettrove.com to dark mode and the Preview shows you how it looks there. If it disappears, use a version of your logo that reads on both, such as your coloured mark rather than black text.

Sharp on every screen. Upload an SVG, or a PNG at least twice the size it is drawn (48px tall), so it stays crisp on high-resolution screens.

An uploaded SVG is checked before we host it. One that contains a script, an event handler, a link or embedded object, foreign content, an external resource or stylesheet, a javascript: URL or XML entities is refused, with the reason. Export it again without that part, or upload a PNG.

A link you paste must be the full https:// address of the image on a public site: not http://, not localhost, not a bare IP address, at most 2000 characters. The editor loads it from there every time it opens: if the address stops working, your users see a broken image in the bar until you fix it. Use an address that never changes, or upload the file so we host it.

Why it is not in your code

Anyone can change a web page's code in their browser. If the name and logo came from createEditor, anyone could put another company's name on your editor, or take yours off. So they come only from your project's settings, which only your team can change.

A branding.logo or branding.name passed in code is therefore ignored, and your project's settings are drawn instead. The one branding option your page has is branding: { poweredBy: true }, which adds "Powered by Lettrove"; it can turn that on, never off.

Common questions

I changed my logo but the editor still shows the old one. An editor keeps what it opened with. Close it and open it again (reload the page).

Can each of my customers have their own logo? The logo and name belong to the project, so every editor a project opens shows the same ones: yours. To show different brands, use a project for each.

Does the logo appear in the emails my users make? No. Branding changes the editor, never the design being edited. A logo inside a design is an image your user places there, like any other.

Do test and live keys show the same branding? Yes: both belong to the same project.

For your AI assistant

• The logo and product name are set in Settings → Embed → Branding at lettrove.com, per project, never in code. branding.logo and branding.name in createEditor (or the branding prop) are ignored.
• The bar draws the logo at most 24px tall and 160px wide; the product name is up to 60 characters.
• Uploads: PNG, JPEG, GIF, WebP or SVG (SVGs without scripts or external content). Links: a full public https:// address.
• Changes show in editors opened after saving.