Lesli Logos & images

Use the standard logo on light backgrounds.

Use the negative logo on dark or saturated backgrounds.

Icons

Use the icon when horizontal space is limited, in app navigation, favicons, and compact UI contexts.

Use the standard icon on light backgrounds.

Use the negative icon on dark backgrounds.

Logo usage rules

• Prefer the standard logo on white or neutral backgrounds.
• Prefer the negative logo on dark sections or image overlays.
• Do not stretch, rotate, outline, or recolor the logo.
• Do not apply gradients, shadows, or effects to the logo.
• Maintain generous clear space around the logo.
• Use the icon only when the full wordmark is not necessary.

Logo customization

Customizing the logo with Lesli is straightforward. In your main Rails app, create a folder at ROR/assets/images/lesli/brand. Lesli will look for this folder and replace the default Lesli logos with your custom branding logos.

You can override all the logo branding within your app by adding the following files:

app-auth.svg -> Replaces the image at the top of the authentication forms.
app-icon.svg -> Default logo for mobile devices.
app-logo.svg -> Main image used for the header, emails, etc.
login-background.jpg -> Replaces to background image on the login page.