Skip to main content

Image Assets

Managing background images and other visual components.

Overview​

Beyond logos and favicons, LibreApps Desktop allows you to customize other key images in the application, such as the login background and placeholder images.

Login Background​

The login page features a large background image that can be easily replaced.

How to Update​

  1. Prepare a high-resolution image (e.g., 1920x1080).
  2. Name it login-bg.jpg.
  3. Place it in rebrand/assets/.
  4. Run ./scripts/build-rebrand.sh.

Placeholder Images​

LibreApps Desktop uses several placeholder images for user avatars, product thumbnails, and blog posts. You can override these by placing files with the same names in the rebrand/assets/ directory.

Common Placeholders​

  • avatar-placeholder.png
  • product-placeholder.png
  • blog-placeholder.jpg

If you are creating custom themes, you should provide preview images for the Theme Gallery.

How to Add​

  1. Take a screenshot of your dashboard with the custom theme applied.
  2. Crop it to a 16:9 aspect ratio.
  3. Name it [ThemeName].png.
  4. Place it in rebrand/assets/gallery/.

Best Practices​

  • ✅ Do this: Optimize your images for the web to keep the application fast.
  • ✅ Do this: Use consistent styling for all your brand images.
  • ❌ Don't do this: Use extremely large file sizes (e.g., > 1MB) for background images; they will slow down the initial page load.