Lobe Theme

A modern interface framework designed for Stable Diffusion WebUI
with an exquisite interface design, a highly customizable UI, and efficiency-boosting features.

English · 简体中文 · Changelog · Report Bug · Request Feature

Please be aware that LobeTheme is currently under active development, and feedback is welcome for any issues encountered.

	Join our Discord community! This is where you can connect with developers and other enthusiastic users of LobeHub.

Star History

In Stable Diffusion WebUI, you can install the Lobe Theme extension through the built-in extension market.

• First, open Stable Diffusion WebUI and go to the extension market. Enter "Lobe Theme" in the search box and click the search button. You will see a list of related extensions.
• After finding the Lobe Theme extension, click the install button. The system will start downloading and installing the extension. After installation, you can find the Lobe Theme in the extension list, and it will take effect after reloading the UI.

If you prefer to manage extensions using Git, you can clone the repository to your extensions folder. Here are the detailed steps:

• Open the command line interface and navigate to the root directory of Stable Diffusion WebUI.
• Run the following command in the command line to clone the repository:

git clone "https://github.com/lobehub/sd-webui-lobe-theme" extensions/lobe-theme

Once you have completed these steps, the Lobe Theme extension will be successfully installed in Stable Diffusion WebUI.

The current theme design provides two visual effects: light theme and dark theme, to meet the visual comfort needs of users in different lighting environments, which can be quickly switched in the upper right corner of the navigation bar.

If you prefer to default to the dark theme, you can achieve this by using the startup parameter --theme=dark.

set COMMANDLINE_ARGS= --theme=dark

In addition, you can also directly switch the theme through URL parameters:

http://localhost:7860/?__theme=light
http://localhost:7860/?__theme=dark

Through these simple and intuitive operations, users can quickly switch the interface theme according to their personal preferences or current environment, in order to achieve the best user experience.

As a design engineer, LobeChat considers the personalized experience of users in interface design, and has introduced a flexible and changeable theme mode, providing a series of color customization options, allowing users to adjust the theme color of the application according to their preferences.

Whether you want a stable deep blue, a lively peach pink, or a professional gray and white, users can find color options that match their style in LobeTheme.

When using the Stable Diffusion model for Prompt writing, an effective feature is the Prompt syntax highlighting.

This feature automatically adds color coding to the input Prompt text according to preset syntax rules, enhancing the user experience and the intuitiveness of operations. Prompt syntax highlighting can not only help users identify and construct syntax structures more clearly, but also improve the efficiency of text editing and debugging.

One of the key highlights of LobeTheme is its highly customizable sidebar feature, designed to make the image generation workflow smoother, ensuring that every user can adjust and optimize their workspace according to their preferences.

sd_model_checkpoint, sd_vae, CLIP_stop_at_last_layers, img2img_background_color, img2img_color_correction, samples_save, samples_format, grid_save, return_grid,  n_rows, live_previews_enable, show_progress_every_n_steps, live_preview_refresh_period

The display of generation information has been improved, with a deep optimization of the data presentation mechanism, and the introduction of a "one-click copy" function to improve information retrieval efficiency.

Now, you can quickly obtain the required Seeds without tedious searching in long strings.

A brand-new image sharing feature has been launched. With a simple one-click operation, you can easily share the current image recipe, create exquisite shared images, and explore more customizable settings to make the shared images more personalized.

A user-friendly prompt word editor has been added to the second tab of the quick setting menu. It includes a series of preset tags covering post-processing, style description, and other key words, simplifying your operation process and helping you edit and manage prompts more efficiently.

In order to improve the interactive experience of mobile users, LobeTheme has implemented an intelligent folding mechanism for breadcrumb navigation and finely adapted the sidebar. These adjustments are aimed at providing convenient and intuitive navigation experience on any device.

However, achieving the same complex functions and detailed customization as the desktop on the mobile end poses certain challenges. Especially when integrating with the Stable Diffusion WebUI interface, high complexity and precise parameter settings are required, which may result in differences in user experience between mobile and desktop.

If you have any suggestions or ideas, please feel free to provide feedback through GitHub Issues or Pull Requests.

In today's multi-device environment, providing a seamless experience for users is crucial. Therefore, we have adopted the Progressive Web Application PWA technology, which is a modern web technology that can elevate web applications to a near-native application experience.

Through PWA, LobeTheme can provide a highly optimized user experience on desktop and mobile devices, while maintaining lightweight and high performance characteristics. Visually and perceptually, it has been carefully designed to ensure that its interface is indistinguishable from native applications, providing smooth animations, responsive layout, and adaptation to different screen resolutions of different devices.

Click the 🪄 button below the Prompt to format the prompt words with one click.

Before formatting

photorealistic   photo of a handsome male (wizard  :1.2）， <lora:LuisapHotlineStyle:0.5> <lora:ElegantHanfuRuqunStyle:0.2>    short beard, white wizard  shirt, (with golden    trim:0.8),

After formatting

photorealistic photo of a handsome male, (wizard:1.2), short beard, white wizard shirt, (with golden trim:0.8), <lora:LuisapHotlineStyle:0.5>, <lora:ElegantHanfuRuqunStyle:0.2>

• 💎 Exquisite UI Design: Carefully designed interface with elegant appearance and smooth interactive effects.
• 🖼️ Multiple Layout Modes: In the dual-column mode, it achieves adjustable canvas proportions, ensuring that the generated images are always on top.
• 🌍 Internationalization Support: Fully supports major i18n languages and welcomes contributions on PR.

✨ With continuous updates in product iterations, we hope to bring more exciting features!

Chrome	Edge	Safari
last 2 versions	last 2 versions	last 2 versions

NPM	Repository	Description	Version
@lobehub/ui	lobehub/lobe-ui	Lobe UI is an open-source UI component library dedicated to building AIGC web applications.
@lobehub/lint	lobehub/lobe-lint	LobeLint provides configurations for ESlint, Stylelint, Commitlint, Prettier, Remark, and Semantic Release for LobeHub.
@lobehub/assets	lobehub/assets	Logo assets, favicons, webfonts for LobeHub.

You can use Github Codespaces for online development:

Alternatively, you can clone it for local development. To enable hot-reloading mode, you need to start stable diffuison on port 7860 in advance.

$ git clone https://github.com/lobehub/sd-webui-lobe-theme.git
$ cd sd-webui-lobe-theme
$ bun install
$ bun dev

Contributions of all types are more than welcome, if you are interested in contributing code, feel free to check out our GitHub Issues to get stuck in to show us what you’re made of.

Every bit counts and your one-time donation sparkles in our galaxy of support! You're a shooting star, making a swift and bright impact on our journey. Thank you for believing in us – your generosity guides us toward our mission, one brilliant flash at a time.

• 🤖 Lobe Chat : An open-source, extensible (Function Calling), high-performance chatbot framework. It supports one-click free deployment of your private ChatGPT/LLM web application.
• 🌏 Lobe i18n : Lobe i18n is an automation tool for the i18n (internationalization) translation process, powered by ChatGPT. It supports features such as automatic splitting of large files, incremental updates, and customization options for the OpenAI model, API proxy, and temperature.
• 💌 Lobe Commit : Lobe Commit is a CLI tool that leverages Langchain/ChatGPT to generate Gitmoji-based commit messages.

• stable-diffusion-webui：https://github.com/AUTOMATIC1111/stable-diffusion-webui
• gradio-theme-gallery: https://huggingface.co/spaces/gradio/theme-gallery
• cozy-nest: https://github.com/Nevysha/Cozy-Nest
• before 1.0.0 version
  • sd-web-ui-quickcs: https://github.com/Gerschel/sd-web-ui-quickcss/
  • Dark-Themes-SD-WebUI-Automatic1111: https://github.com/Nacurutu/Dark-Themes-SD-WebUI-Automatic1111

Copyright © 2023 LobeHub.
This project is AGPL3 licensed.