2022-09-02 10:28:36 +02:00
<!DOCTYPE html>
< html >
2022-09-23 16:18:48 +02:00
< head >
2022-12-24 19:53:51 +01:00
< title > Easy Diffusion< / title >
2022-09-02 10:28:36 +02:00
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
2022-11-27 21:49:23 +01:00
< meta name = "theme-color" content = "#673AB6" >
2022-10-18 16:48:56 +02:00
< link rel = "icon" type = "image/png" href = "/media/images/favicon-16x16.png" sizes = "16x16" >
< link rel = "icon" type = "image/png" href = "/media/images/favicon-32x32.png" sizes = "32x32" >
2023-02-06 11:02:54 +01:00
< link rel = "stylesheet" href = "/media/css/jquery-confirm.min.css" >
2022-11-18 13:01:20 +01:00
< link rel = "stylesheet" href = "/media/css/fonts.css" >
< link rel = "stylesheet" href = "/media/css/themes.css" >
< link rel = "stylesheet" href = "/media/css/main.css" >
< link rel = "stylesheet" href = "/media/css/auto-save.css" >
< link rel = "stylesheet" href = "/media/css/modifier-thumbnails.css" >
< link rel = "stylesheet" href = "/media/css/fontawesome-all.min.css" >
2022-12-01 11:31:09 +01:00
< link rel = "stylesheet" href = "/media/css/image-editor.css" >
2023-02-12 10:18:09 +01:00
< link rel = "stylesheet" href = "/media/css/searchable-models.css" >
2023-03-15 02:43:49 +01:00
< link rel = "stylesheet" href = "/media/css/image-modal.css" >
2022-11-26 21:50:27 +01:00
< link rel = "manifest" href = "/media/manifest.webmanifest" >
2022-10-18 16:48:56 +02:00
< script src = "/media/js/jquery-3.6.1.min.js" > < / script >
2022-11-22 21:27:36 +01:00
< script src = "/media/js/jquery-confirm.min.js" > < / script >
2023-03-14 06:10:24 +01:00
< script src = "/media/js/jszip.min.js" > < / script >
< script src = "/media/js/FileSaver.min.js" > < / script >
2022-11-16 12:24:28 +01:00
< script src = "/media/js/marked.min.js" > < / script >
2022-09-23 16:18:48 +02:00
< / head >
2022-09-02 10:28:36 +02:00
< body >
< div id = "container" >
2022-09-23 13:37:54 +02:00
< div id = "top-nav" >
< div id = "logo" >
2022-11-22 06:37:50 +01:00
< h1 >
2023-03-11 04:57:04 +01:00
< img id = "logo_img" src = "/media/images/icon-512x512.png" >
2022-12-24 17:06:47 +01:00
Easy Diffusion
2023-03-28 12:28:18 +02:00
< small > v2.5.30 < span id = "updateBranchLabel" > < / span > < / small >
2022-11-22 06:37:50 +01:00
< / h1 >
2022-09-23 13:37:54 +02:00
< / div >
2022-11-02 07:03:05 +01:00
< div id = "server-status" >
< div id = "server-status-color" > ●< / div >
< span id = "server-status-msg" > Stable Diffusion is starting..< / span >
< / div >
2023-02-06 14:39:39 +01:00
< div id = "tab-container" class = "tab-container" >
2022-11-09 04:54:41 +01:00
< span id = "tab-main" class = "tab active" >
2022-11-02 07:03:05 +01:00
< span > < i class = "fa fa-image icon" > < / i > Generate< / span >
< / span >
2022-11-09 04:54:41 +01:00
< span id = "tab-settings" class = "tab" >
2022-09-23 13:37:54 +02:00
< span > < i class = "fa fa-gear icon" > < / i > Settings< / span >
2022-11-02 07:03:05 +01:00
< / span >
2022-11-09 04:54:41 +01:00
< span id = "tab-about" class = "tab" >
2022-11-09 05:19:31 +01:00
< span > < i class = "fa fa-comments icon" > < / i > Help & Community< / span >
2022-11-02 07:03:05 +01:00
< / span >
< / div >
2022-09-23 13:37:54 +02:00
< / div >
2022-11-09 04:54:41 +01:00
< div id = "tab-content-wrapper" >
< div id = "tab-content-main" class = "tab-content active flex-container" >
2022-12-12 14:33:16 +01:00
< div id = "editor" >
2022-09-02 10:28:36 +02:00
< div id = "editor-inputs" >
< div id = "editor-inputs-prompt" class = "row" >
2023-02-28 11:07:38 +01:00
< label for = "prompt" > < b > Enter Prompt< / b > < / label > < small > or< / small > < button id = "promptsFromFileBtn" class = "tertiaryButton" > Load from a file< / button >
2022-09-02 10:28:36 +02:00
< textarea id = "prompt" class = "col-free" > a photograph of an astronaut riding a horse< / textarea >
2022-10-07 20:16:56 +02:00
< input id = "prompt_from_file" name = "prompt_from_file" type = "file" / > <!-- hidden -->
2022-11-08 12:49:20 +01:00
< label for = "negative_prompt" class = "collapsible" id = "negative_prompt_handle" >
Negative Prompt
2022-12-26 19:04:36 +01:00
< a href = "https://github.com/cmdr2/stable-diffusion-ui/wiki/Writing-prompts#negative-prompts" target = "_blank" > < i class = "fa-solid fa-circle-question help-btn" > < span class = "simple-tooltip top" > Click to learn more about Negative Prompts< / span > < / i > < / a >
2022-11-08 12:49:20 +01:00
< small > (optional)< / small >
< / label >
2022-10-17 10:15:08 +02:00
< div class = "collapsible-content" >
2022-11-16 23:35:27 +01:00
< textarea id = "negative_prompt" name = "negative_prompt" placeholder = "list the things to remove from the image (e.g. fog, green)" > < / textarea >
2022-10-17 10:15:08 +02:00
< / div >
< / div >
2022-10-14 19:31:23 +02:00
2022-09-02 10:28:36 +02:00
< div id = "editor-inputs-init-image" class = "row" >
2022-12-01 11:31:09 +01:00
< label for = "init_image" > Initial Image (img2img) < small > (optional)< / small > < / label >
2022-09-15 19:59:55 +02:00
2022-09-02 10:28:36 +02:00
< div id = "init_image_preview_container" class = "image_preview_container" >
2022-10-17 08:10:01 +02:00
< div id = "init_image_wrapper" >
< img id = "init_image_preview" src = "" / >
2023-03-01 10:47:27 +01:00
< span id = "init_image_size_box" class = "img_bottom_label" > < / span >
2022-11-30 16:44:18 +01:00
< button class = "init_image_clear image_clear_btn" > < i class = "fa-solid fa-xmark" > < / i > < / button >
2022-10-17 08:10:01 +02:00
< / div >
2022-12-06 09:26:51 +01:00
< div id = "init_image_buttons" >
< div class = "button" >
< i class = "fa-regular fa-folder-open" > < / i >
Browse
< input id = "init_image" name = "init_image" type = "file" / >
< / div >
< div id = "init_image_button_draw" class = "button" >
< i class = "fa-solid fa-pencil" > < / i >
Draw
< / div >
< div id = "inpaint_button_container" >
< div id = "init_image_button_inpaint" class = "button" >
< i class = "fa-solid fa-paintbrush" > < / i >
Inpaint
< / div >
< input id = "enable_mask" name = "enable_mask" type = "checkbox" >
< / div >
2022-12-01 11:31:09 +01:00
< / div >
2022-09-02 10:28:36 +02:00
< / div >
2022-12-01 11:31:09 +01:00
2022-12-24 19:53:51 +01:00
< div id = "apply_color_correction_setting" class = "pl-5" > < input id = "apply_color_correction" name = "apply_color_correction" type = "checkbox" > < label for = "apply_color_correction" > Preserve color profile < small > (helps during inpainting)< / small > < / label > < / div >
2022-09-02 10:28:36 +02:00
< / div >
< div id = "editor-inputs-tags-container" class = "row" >
2023-02-09 15:00:55 +01:00
< label > Image Modifiers < i class = "fa-solid fa-circle-question help-btn" > < span class = "simple-tooltip right" > click an Image Modifier to remove it, right-click to temporarily disable it, use Ctrl+Mouse Wheel to adjust its weight< / span > < / i > < / label >
2022-09-22 17:01:30 +02:00
< div id = "editor-inputs-tags-list" > < / div >
2022-09-02 10:28:36 +02:00
< / div >
2022-11-18 12:44:58 +01:00
< button id = "makeImage" class = "primaryButton" > Make Image< / button >
2022-12-11 14:57:01 +01:00
< div id = "render-buttons" >
< button id = "stopImage" class = "secondaryButton" > Stop All< / button >
< button id = "pause" > < i class = "fa-solid fa-pause" > < / i > Pause All< / button >
< button id = "resume" > < i class = "fa-solid fa-play" > < / i > Resume< / button >
< / div >
2022-09-02 10:28:36 +02:00
< / div >
2022-11-02 07:03:05 +01:00
< span class = "line-separator" > < / span >
2022-09-02 10:28:36 +02:00
2022-11-09 09:13:43 +01:00
< div id = "editor-settings" class = "settings-box panel-box" >
2022-10-22 02:44:04 +02:00
< h4 class = "collapsible" >
Image Settings
2022-11-02 07:03:05 +01:00
< i id = "reset-image-settings" class = "fa-solid fa-arrow-rotate-left section-button" >
2022-12-11 08:29:23 +01:00
< span class = "simple-tooltip top-left" >
2022-10-22 02:44:04 +02:00
Reset Image Settings
< / span >
< / i >
< / h4 >
2022-11-02 07:03:05 +01:00
< div id = "editor-settings-entries" class = "collapsible-content" >
< div > < table >
2022-10-17 08:10:01 +02:00
< tr > < b class = "settings-subheader" > Image Settings< / b > < / tr >
2022-11-30 04:04:42 +01:00
< tr class = "pl-5" > < td > < label for = "seed" > Seed:< / label > < / td > < td > < input id = "seed" name = "seed" size = "10" value = "0" onkeypress = "preventNonNumericalInput(event)" > < input id = "random_seed" name = "random_seed" type = "checkbox" checked > < label for = "random_seed" > Random< / label > < / td > < / tr >
2022-11-04 15:18:34 +01:00
< tr class = "pl-5" > < td > < label for = "num_outputs_total" > Number of Images:< / label > < / td > < td > < input id = "num_outputs_total" name = "num_outputs_total" value = "1" size = "1" onkeypress = "preventNonNumericalInput(event)" > < label > < small > (total)< / small > < / label > < input id = "num_outputs_parallel" name = "num_outputs_parallel" value = "1" size = "1" onkeypress = "preventNonNumericalInput(event)" > < label for = "num_outputs_parallel" > < small > (in parallel)< / small > < / label > < / td > < / tr >
2023-02-12 10:18:09 +01:00
< tr class = "pl-5" > < td > < label for = "stable_diffusion_model" > Model:< / label > < / td > < td class = "model-input" >
2023-02-13 07:31:40 +01:00
< input id = "stable_diffusion_model" type = "text" spellcheck = "false" autocomplete = "off" class = "model-filter" data-path = "" / >
2023-02-12 10:18:09 +01:00
< button id = "reload-models" class = "secondaryButton reloadModels" > < i class = 'fa-solid fa-rotate' > < / i > < / button >
2022-12-11 08:29:23 +01:00
< a href = "https://github.com/cmdr2/stable-diffusion-ui/wiki/Custom-Models" target = "_blank" > < i class = "fa-solid fa-circle-question help-btn" > < span class = "simple-tooltip top-left" > Click to learn more about custom models< / span > < / i > < / a >
2022-10-17 08:10:01 +02:00
< / td > < / tr >
2022-12-24 09:08:55 +01:00
<!-- <tr id="modelConfigSelection" class="pl - 5"><td><label for="model_config">Model Config:</i></label></td><td>
2022-12-22 07:24:00 +01:00
< select id = "model_config" name = "model_config" >
< / select >
2022-12-24 09:08:55 +01:00
< / td > < / tr > -->
2022-11-08 12:49:20 +01:00
< tr class = "pl-5" > < td > < label for = "vae_model" > Custom VAE:< / i > < / label > < / td > < td >
2023-02-13 07:31:40 +01:00
< input id = "vae_model" type = "text" spellcheck = "false" autocomplete = "off" class = "model-filter" data-path = "" / >
2022-12-11 08:29:23 +01:00
< a href = "https://github.com/cmdr2/stable-diffusion-ui/wiki/VAE-Variational-Auto-Encoder" target = "_blank" > < i class = "fa-solid fa-circle-question help-btn" > < span class = "simple-tooltip top-left" > Click to learn more about VAEs< / span > < / i > < / a >
2022-11-08 12:24:15 +01:00
< / td > < / tr >
2022-12-12 10:51:02 +01:00
< tr id = "samplerSelection" class = "pl-5" > < td > < label for = "sampler_name" > Sampler:< / label > < / td > < td >
< select id = "sampler_name" name = "sampler_name" >
2022-12-17 12:15:43 +01:00
< option value = "plms" > PLMS< / option >
< option value = "ddim" > DDIM< / option >
< option value = "heun" > Heun< / option >
< option value = "euler" > Euler< / option >
< option value = "euler_a" selected > Euler Ancestral< / option >
< option value = "dpm2" > DPM2< / option >
< option value = "dpm2_a" > DPM2 Ancestral< / option >
< option value = "lms" > LMS< / option >
< option value = "dpm_solver_stability" > DPM Solver (Stability AI)< / option >
2023-03-20 14:52:45 +01:00
< option value = "dpmpp_2s_a" > DPM++ 2s Ancestral (Karras)< / option >
< option value = "dpmpp_2m" > DPM++ 2m (Karras)< / option >
< option value = "dpmpp_sde" > DPM++ SDE (Karras)< / option >
< option value = "dpm_fast" > DPM Fast (Karras)< / option >
< option value = "dpm_adaptive" > DPM Adaptive (Karras)< / option >
2023-02-17 05:54:59 +01:00
< option value = "unipc_snr" > UniPC SNR< / option >
< option value = "unipc_tu" > UniPC TU< / option >
< option value = "unipc_snr_2" > UniPC SNR 2< / option >
2023-03-21 13:29:20 +01:00
< option value = "unipc_tu_2" > UniPC TU 2< / option >
2023-02-17 05:54:59 +01:00
< option value = "unipc_tq" > UniPC TQ< / option >
2022-10-15 01:36:29 +02:00
< / select >
2022-12-11 08:29:23 +01:00
< a href = "https://github.com/cmdr2/stable-diffusion-ui/wiki/How-to-Use#samplers" target = "_blank" > < i class = "fa-solid fa-circle-question help-btn" > < span class = "simple-tooltip top-left" > Click to learn more about samplers< / span > < / i > < / a >
2022-10-17 08:10:01 +02:00
< / td > < / tr >
< tr class = "pl-5" > < td > < label > Image Size: < / label > < / td > < td >
2022-10-15 01:36:29 +02:00
< select id = "width" name = "width" value = "512" >
< option value = "128" > 128 (*)< / option >
< option value = "192" > 192< / option >
< option value = "256" > 256 (*)< / option >
< option value = "320" > 320< / option >
< option value = "384" > 384< / option >
< option value = "448" > 448< / option >
< option value = "512" selected > 512 (*)< / option >
< option value = "576" > 576< / option >
< option value = "640" > 640< / option >
< option value = "704" > 704< / option >
< option value = "768" > 768 (*)< / option >
< option value = "832" > 832< / option >
< option value = "896" > 896< / option >
< option value = "960" > 960< / option >
< option value = "1024" > 1024 (*)< / option >
< option value = "1280" > 1280< / option >
< option value = "1536" > 1536< / option >
< option value = "1792" > 1792< / option >
< option value = "2048" > 2048< / option >
< / select >
< label for = "width" > < small > (width)< / small > < / label >
< select id = "height" name = "height" value = "512" >
< option value = "128" > 128 (*)< / option >
< option value = "192" > 192< / option >
< option value = "256" > 256 (*)< / option >
< option value = "320" > 320< / option >
< option value = "384" > 384< / option >
< option value = "448" > 448< / option >
< option value = "512" selected > 512 (*)< / option >
< option value = "576" > 576< / option >
< option value = "640" > 640< / option >
< option value = "704" > 704< / option >
< option value = "768" > 768 (*)< / option >
< option value = "832" > 832< / option >
< option value = "896" > 896< / option >
< option value = "960" > 960< / option >
< option value = "1024" > 1024 (*)< / option >
< option value = "1280" > 1280< / option >
< option value = "1536" > 1536< / option >
< option value = "1792" > 1792< / option >
< option value = "2048" > 2048< / option >
< / select >
< label for = "height" > < small > (height)< / small > < / label >
2023-03-12 20:43:54 +01:00
< div id = "small_image_warning" class = "displayNone" > Small image sizes can cause bad image quality< / div >
2022-10-17 08:10:01 +02:00
< / td > < / tr >
2022-11-04 15:18:34 +01:00
< tr class = "pl-5" > < td > < label for = "num_inference_steps" > Inference Steps:< / label > < / td > < td > < input id = "num_inference_steps" name = "num_inference_steps" size = "4" value = "25" onkeypress = "preventNonNumericalInput(event)" > < / td > < / tr >
2022-12-23 13:18:08 +01:00
< tr class = "pl-5" > < td > < label for = "guidance_scale_slider" > Guidance Scale:< / label > < / td > < td > < input id = "guidance_scale_slider" name = "guidance_scale_slider" class = "editor-slider" value = "75" type = "range" min = "11" max = "500" > < input id = "guidance_scale" name = "guidance_scale" size = "4" pattern = "^[0-9\.]+$" onkeypress = "preventNonNumericalInput(event)" > < / td > < / tr >
2022-12-12 14:32:34 +01:00
< tr id = "prompt_strength_container" class = "pl-5" > < td > < label for = "prompt_strength_slider" > Prompt Strength:< / label > < / td > < td > < input id = "prompt_strength_slider" name = "prompt_strength_slider" class = "editor-slider" value = "80" type = "range" min = "0" max = "99" > < input id = "prompt_strength" name = "prompt_strength" size = "4" pattern = "^[0-9\.]+$" onkeypress = "preventNonNumericalInput(event)" > < br / > < / td > < / tr >
2023-03-21 13:29:20 +01:00
< tr id = "lora_model_container" class = "pl-5" > < td > < label for = "lora_model" > LoRA:< / i > < / label > < / td > < td >
< input id = "lora_model" type = "text" spellcheck = "false" autocomplete = "off" class = "model-filter" data-path = "" / >
< / td > < / tr >
< tr id = "lora_alpha_container" class = "pl-5" >
< td > < label for = "lora_alpha_slider" > LoRA strength:< / label > < / td >
2023-04-01 12:38:14 +02:00
< td > < input id = "lora_alpha_slider" name = "lora_alpha_slider" class = "editor-slider" value = "50" type = "range" min = "0" max = "100" > < input id = "lora_alpha" name = "lora_alpha" size = "4" pattern = "^[0-9\.]+$" onkeypress = "preventNonNumericalInput(event)" > < br / > < / td >
2023-03-21 13:29:20 +01:00
< / tr >
2022-12-12 14:32:34 +01:00
< tr class = "pl-5" > < td > < label for = "hypernetwork_model" > Hypernetwork:< / i > < / label > < / td > < td >
2023-02-13 07:31:40 +01:00
< input id = "hypernetwork_model" type = "text" spellcheck = "false" autocomplete = "off" class = "model-filter" data-path = "" / >
2022-12-12 14:32:34 +01:00
< / td > < / tr >
< tr id = "hypernetwork_strength_container" class = "pl-5" >
< td > < label for = "hypernetwork_strength_slider" > Hypernetwork Strength:< / label > < / td >
< td > < input id = "hypernetwork_strength_slider" name = "hypernetwork_strength_slider" class = "editor-slider" value = "100" type = "range" min = "0" max = "100" > < input id = "hypernetwork_strength" name = "hypernetwork_strength" size = "4" pattern = "^[0-9\.]+$" onkeypress = "preventNonNumericalInput(event)" > < br / > < / td >
< / tr >
2022-10-17 08:10:01 +02:00
< tr class = "pl-5" > < td > < label for = "output_format" > Output Format:< / label > < / td > < td >
2022-10-15 01:36:29 +02:00
< select id = "output_format" name = "output_format" >
< option value = "jpeg" selected > jpeg< / option >
< option value = "png" > png< / option >
2023-02-19 04:37:34 +01:00
< option value = "webp" > webp< / option >
2022-10-15 01:36:29 +02:00
< / select >
2023-03-29 00:46:13 +02:00
< span id = "output_lossless_container" class = "displayNone" >
2023-03-25 03:46:03 +01:00
< input id = "output_lossless" name = "output_lossless" type = "checkbox" > < label for = "output_lossless" > Lossless< / label > < / td > < / tr >
< / span >
2022-10-17 08:10:01 +02:00
< / td > < / tr >
2023-02-19 04:37:34 +01:00
< tr class = "pl-5" id = "output_quality_row" > < td > < label for = "output_quality" > Image Quality:< / label > < / td > < td >
2022-12-12 14:32:34 +01:00
< input id = "output_quality_slider" name = "output_quality" class = "editor-slider" value = "75" type = "range" min = "10" max = "95" > < input id = "output_quality" name = "output_quality" size = "4" pattern = "^[0-9\.]+$" onkeypress = "preventNonNumericalInput(event)" >
< / td > < / tr >
2022-11-02 07:03:05 +01:00
< / table > < / div >
2022-09-23 13:37:54 +02:00
2022-11-02 07:03:05 +01:00
< div > < ul >
2022-09-23 13:37:54 +02:00
< li > < b class = "settings-subheader" > Render Settings< / b > < / li >
2022-12-06 11:09:27 +01:00
< li class = "pl-5" > < input id = "stream_image_progress" name = "stream_image_progress" type = "checkbox" > < label for = "stream_image_progress" > Show a live preview < small > (uses more VRAM, slower images)< / small > < / label > < / li >
2023-02-16 06:05:46 +01:00
< li class = "pl-5" > < input id = "use_face_correction" name = "use_face_correction" type = "checkbox" > < label for = "use_face_correction" > Fix incorrect faces and eyes< / label > < div style = "display:inline-block;" > < input id = "gfpgan_model" type = "text" spellcheck = "false" autocomplete = "off" class = "model-filter" data-path = "" / > < / div > < / li >
2022-09-23 13:37:54 +02:00
< li class = "pl-5" >
2022-12-27 11:50:16 +01:00
< input id = "use_upscale" name = "use_upscale" type = "checkbox" > < label for = "use_upscale" > Scale up by< / label >
< select id = "upscale_amount" name = "upscale_amount" >
< option value = "2" > 2x< / option >
< option value = "4" selected > 4x< / option >
< / select >
with
2022-09-23 13:37:54 +02:00
< select id = "upscale_model" name = "upscale_model" >
< option value = "RealESRGAN_x4plus" selected > RealESRGAN_x4plus< / option >
< option value = "RealESRGAN_x4plus_anime_6B" > RealESRGAN_x4plus_anime_6B< / option >
< / select >
2022-09-03 17:52:56 +02:00
< / li >
2022-09-23 13:37:54 +02:00
< li class = "pl-5" > < input id = "show_only_filtered_image" name = "show_only_filtered_image" type = "checkbox" checked > < label for = "show_only_filtered_image" > Show only the corrected/upscaled image< / label > < / li >
2022-11-02 07:03:05 +01:00
< / ul > < / div >
< / div >
2022-09-02 10:28:36 +02:00
< / div >
2022-11-09 09:13:43 +01:00
< div id = "editor-modifiers" class = "panel-box" >
2022-11-02 07:03:05 +01:00
< h4 class = "collapsible" >
2022-11-09 09:13:43 +01:00
Image Modifiers (art styles, tags etc)
2022-11-02 07:03:05 +01:00
< i id = "modifier-settings-btn" class = "fa-solid fa-gear section-button" >
2022-11-09 04:22:14 +01:00
< span class = "simple-tooltip left" >
2022-11-02 07:03:05 +01:00
Add Custom Modifiers
< / span >
< / i >
< / h4 >
2022-09-02 10:28:36 +02:00
< div id = "editor-modifiers-entries" class = "collapsible-content" >
2022-10-21 11:24:45 +02:00
< div id = "editor-modifiers-entries-toolbar" >
< label for = "preview-image" > Image Style:< / label >
< select id = "preview-image" name = "preview-image" value = "portrait" >
< option value = "portrait" selected = "" > Face< / option >
< option value = "landscape" > Landscape< / option >
< / select >
< label for = "modifier-card-size-slider" > Thumbnail Size:< / label >
< input id = "modifier-card-size-slider" name = "modifier-card-size-slider" value = "0" type = "range" min = "-3" max = "5" >
< / div >
2022-09-02 10:28:36 +02:00
< / div >
< / div >
< / div >
2022-09-23 13:37:54 +02:00
< div id = "preview" class = "col-free" >
2023-02-14 15:03:25 +01:00
2023-04-06 12:12:48 +02:00
< div id = "initial-text" >
Type a prompt and press the "Make Image" button.< br / > < br / > You can set an "Initial Image" if you want to guide the AI.< br / > < br / >
You can also add modifiers like "Realistic", "Pencil Sketch", "ArtStation" etc by browsing through the "Image Modifiers" section
and selecting the desired modifiers.< br / > < br / >
Click "Image Settings" for additional settings like seed, image size, number of images to generate etc.< br / > < br / > Enjoy! :)
< / div >
2023-01-16 08:34:56 +01:00
< div id = "preview-content" >
2023-03-20 22:53:13 +01:00
< div id = "preview-tools" class = "displayNone" >
2023-02-24 17:20:21 +01:00
< button id = "clear-all-previews" class = "secondaryButton" > < i class = "fa-solid fa-trash-can icon" > < / i > Clear All< / button >
2023-03-14 06:10:24 +01:00
< button class = "tertiaryButton" id = "show-download-popup" > < i class = "fa-solid fa-download" > < / i > Download images< / button >
2023-03-01 13:57:48 +01:00
< div class = "display-settings" >
2023-03-28 13:43:37 +02:00
< button id = "undo" class = "displayNone primaryButton" >
2023-03-20 22:53:13 +01:00
Undo < i class = "fa-solid fa-rotate-left icon" > < / i >
< span class = "simple-tooltip left" > Undo last remove< / span >
< / button >
2023-03-02 09:25:53 +01:00
< span class = "auto-scroll" > < / span > <!-- hack for Rabbit Hole update -->
2023-03-01 13:57:48 +01:00
< button id = "auto_scroll_btn" class = "tertiaryButton" >
< i class = "fa-solid fa-arrows-up-to-line icon" > < / i >
< input id = "auto_scroll" name = "auto_scroll" type = "checkbox" style = "display: none" >
< span class = "simple-tooltip left" >
Scroll to generated image (< span class = "state" > OFF< / span > )
< / span >
< / button >
< button class = "dropdown tertiaryButton" >
< i class = "fa-solid fa-magnifying-glass-plus icon dropbtn" > < / i >
< span class = "simple-tooltip left" >
2023-03-01 14:05:41 +01:00
Image Size
2023-03-01 13:57:48 +01:00
< / span >
2023-02-22 15:38:17 +01:00
< / button >
2023-02-22 15:02:00 +01:00
< div class = "dropdown-content" >
< div class = "dropdown-item" >
< input id = "thumbnail_size" name = "thumbnail_size" class = "editor-slider" type = "range" value = "70" min = "5" max = "200" oninput = "sliderUpdate(event)" >
< input id = "thumbnail_size-input" name = "thumbnail_size-input" size = "3" value = "70" pattern = "^[0-9.]+$" onkeypress = "preventNonNumericalInput(event)" oninput = "sliderUpdate(event)" > %
< / div >
< / div >
< / div >
2023-02-23 04:11:18 +01:00
< div class = "clearfix" style = "clear: both;" > < / div >
2023-01-16 08:34:56 +01:00
< / div >
2022-09-02 10:28:36 +02:00
< / div >
< / div >
2022-11-09 04:54:41 +01:00
< / div >
< div id = "tab-content-settings" class = "tab-content" >
< div id = "system-settings" class = "tab-content-inner" >
< h1 > System Settings< / h1 >
2022-11-18 02:58:09 +01:00
< div class = "parameters-table" > < / div >
2022-11-14 16:51:48 +01:00
< br / >
2022-11-15 07:52:55 +01:00
< button id = "save-system-settings-btn" class = "primaryButton" > Save< / button >
< br / > < br / >
2022-11-14 16:51:48 +01:00
< div >
< h3 > < i class = "fa fa-microchip icon" > < / i > System Info< / h3 >
2022-11-30 10:04:24 +01:00
< div id = "system-info" >
< table >
< tr > < td > < label > Processor:< / label > < / td > < td id = "system-info-cpu" class = "value" > < / td > < / tr >
< tr > < td > < label > Compatible Graphics Cards (all):< / label > < / td > < td id = "system-info-gpus-all" class = "value" > < / td > < / tr >
< tr > < td > < / td > < td > < / td > < / tr >
< tr > < td > < label > Used for rendering 🔥:< / label > < / td > < td id = "system-info-rendering-devices" class = "value" > < / td > < / tr >
2022-12-11 08:29:23 +01:00
< tr > < td > < label > Server Addresses < i class = "fa-solid fa-circle-question help-btn" > < span class = "simple-tooltip top-left" > You can access Stable Diffusion UI from other devices using these addresses< / span > < / i > :< / label > < / td > < td id = "system-info-server-hosts" class = "value" > < / td > < / tr >
2022-11-30 10:04:24 +01:00
< / table >
< / div >
2022-11-14 16:51:48 +01:00
< / div >
2022-11-23 11:25:36 +01:00
2022-11-09 04:54:41 +01:00
< / div >
< / div >
< div id = "tab-content-about" class = "tab-content" >
< div class = "tab-content-inner" >
2022-11-09 23:42:56 +01:00
< div class = "float-container" >
< div class = "float-child" >
2022-11-14 06:53:22 +01:00
< h1 > Help< / h1 >
2022-11-09 23:42:56 +01:00
< ul id = "help-links" >
< li > < span class = "help-section" > Using the software< / span >
< ul >
< li > < a href = "https://github.com/cmdr2/stable-diffusion-ui/wiki/How-To-Use" target = "_blank" > < i class = "fa-solid fa-book fa-fw" > < / i > How to use< / a >
< li > < a href = "https://github.com/cmdr2/stable-diffusion-ui/wiki/UI-Overview" target = "_blank" > < i class = "fa-solid fa-list fa-fw" > < / i > UI Overview< / a >
< li > < a href = "https://github.com/cmdr2/stable-diffusion-ui/wiki/Writing-Prompts" target = "_blank" > < i class = "fa-solid fa-pen-to-square fa-fw" > < / i > Writing prompts< / a >
< li > < a href = "https://github.com/cmdr2/stable-diffusion-ui/wiki/Inpainting" target = "_blank" > < i class = "fa-solid fa-paintbrush fa-fw" > < / i > Inpainting< / a >
2022-11-17 09:09:29 +01:00
< li > < a href = "https://github.com/cmdr2/stable-diffusion-ui/wiki/Run-on-Multiple-GPUs" target = "_blank" > < i class = "fa-solid fa-paintbrush fa-fw" > < / i > Run on Multiple GPUs< / a >
2022-11-09 23:42:56 +01:00
< / ul >
< li > < span class = "help-section" > Installation< / span >
< ul >
< li > < a href = "https://github.com/cmdr2/stable-diffusion-ui/wiki/Troubleshooting" target = "_blank" > < i class = "fa-solid fa-circle-question fa-fw" > < / i > Troubleshooting< / a >
< / ul >
< li > < span class = "help-section" > Downloadable Content< / span >
< ul >
< li > < a href = "https://github.com/cmdr2/stable-diffusion-ui/wiki/Custom-Models" target = "_blank" > < i class = "fa-solid fa-images fa-fw" > < / i > Custom Models< / a >
< li > < a href = "https://github.com/cmdr2/stable-diffusion-ui/wiki/UI-Plugins" target = "_blank" > < i class = "fa-solid fa-puzzle-piece fa-fw" > < / i > UI Plugins< / a >
< li > < a href = "https://github.com/cmdr2/stable-diffusion-ui/wiki/VAE-Variational-Auto-Encoder" target = "_blank" > < i class = "fa-solid fa-hand-sparkles fa-fw" > < / i > VAE Variational Auto Encoder< / a >
< / ul >
< / ul >
< / div >
< div class = "float-child" >
2022-11-14 06:53:22 +01:00
< h1 > Community< / h1 >
2022-11-09 23:42:56 +01:00
< ul id = "community-links" >
< li > < a href = "https://discord.com/invite/u9yhsFmEkB" target = "_blank" > < i class = "fa-brands fa-discord fa-fw" > < / i > Discord user community< / a > < / li >
< li > < a href = "https://www.reddit.com/r/StableDiffusionUI/" target = "_blank" > < i class = "fa-brands fa-reddit fa-fw" > < / i > Reddit community< / a > < / li >
< li > < a href = "https://github.com/cmdr2/stable-diffusion-ui" target = "_blank" > < i class = "fa-brands fa-github fa-fw" > < / i > Source code on GitHub< / a > < / li >
< / ul >
< / div >
< / div >
2022-11-09 04:54:41 +01:00
< / div >
2022-10-29 03:25:54 +02:00
< / div >
< / div >
2022-11-09 04:54:41 +01:00
2022-09-02 10:28:36 +02:00
2023-03-14 06:10:24 +01:00
< div class = "popup" id = "download-images-popup" >
< div >
< i class = "close-button fa-solid fa-xmark" > < / i >
< h1 > Download all images< / h1 >
< div class = "parameters-table" >
< div >
< div > < i class = "fa fa-file-zipper" > < / i > < / div >
< div > < label for = "theme" > Download as a ZIP file< / label > < small > Instead of downloading individual files, generate one zip file with all images< / small > < / div >
< div > < div class = "input-toggle" > < input id = "zip_toggle" name = "zip_toggle" checked = "" type = "checkbox" > < label for = "zip_toggle" > < / label > < / div > < / div >
< / div >
< div id = "download-add-folders" >
< div > < i class = "fa fa-folder-tree" > < / i > < / div >
< div > < label for = "theme" > Add per-job folders< / label > < small > Place images into job folders< / small > < / div >
< div > < div class = "input-toggle" > < input id = "tree_toggle" name = "tree_toggle" checked = "" type = "checkbox" > < label for = "tree_toggle" > < / label > < / div > < / div >
< / div >
< div >
< div > < i class = "fa fa-sliders" > < / i > < / div >
< div > < label for = "theme" > Add metadata files< / label > < small > For each image, also download a JSON file with all the settings used to generate the image< / small > < / div >
< div > < div class = "input-toggle" > < input id = "json_toggle" name = "json_toggle" checked = "" type = "checkbox" > < label for = "json_toggle" > < / label > < / div > < / div >
< / div >
< / div >
< br / >
< button id = "save-all-images" class = "primaryButton" > < i class = "fa-solid fa-images" > < / i > Start download< / button >
< / div >
< / div >
2022-10-29 01:48:32 +02:00
< div id = "save-settings-config" class = "popup" >
2022-10-17 09:14:05 +02:00
< div >
2022-10-29 01:48:32 +02:00
< i class = "close-button fa-solid fa-xmark" > < / i >
2022-10-17 09:14:05 +02:00
< h1 > Save Settings Configuration< / h1 >
2022-10-20 06:12:01 +02:00
< p > Select which settings should be remembered when restarting the browser< / p >
2022-10-29 03:25:54 +02:00
< table id = "save-settings-config-table" class = "form-table" >
2022-10-17 09:14:05 +02:00
< / table >
< / div >
< / div >
2023-03-14 06:07:21 +01:00
< div id = "modifier-settings-config" class = "popup" tabindex = "0" >
2022-10-21 10:38:16 +02:00
< div >
2022-10-29 01:48:32 +02:00
< i class = "close-button fa-solid fa-xmark" > < / i >
2022-10-21 10:38:16 +02:00
< h1 > Modifier Settings< / h1 >
< p > Set your custom modifiers (one per line)< / p >
2023-03-14 06:07:21 +01:00
< textarea id = "custom-modifiers-input" placeholder = "Enter your custom modifiers, one-per-line" spellcheck = "false" > < / textarea >
2022-10-21 18:05:20 +02:00
< p > < small > < b > Tip:< / b > You can include special characters like {} () [] and |. You can also put multiple comma-separated phrases in a single line, to make a single modifier that combines all of those.< / small > < / p >
2022-10-21 10:38:16 +02:00
< / div >
< / div >
2022-12-01 11:31:09 +01:00
< div id = "image-editor" class = "popup image-editor-popup" >
< div >
< i class = "close-button fa-solid fa-xmark" > < / i >
< h1 > Image Editor< / h1 >
< div class = "flex-container" >
< div class = "editor-controls-left" > < / div >
< div class = "editor-controls-center" >
< div > < / div >
< / div >
< div class = "editor-controls-right" >
< div > < / div >
< / div >
< / div >
< / div >
< / div >
< div id = "image-inpainter" class = "popup image-editor-popup" >
< div >
< i class = "close-button fa-solid fa-xmark" > < / i >
< h1 > Inpainter< / h1 >
< div class = "flex-container" >
< div class = "editor-controls-left" > < / div >
< div class = "editor-controls-center" >
< div > < / div >
< / div >
< div class = "editor-controls-right" >
< div > < / div >
< / div >
< / div >
< / div >
< / div >
2022-11-09 05:19:31 +01:00
< div id = "footer-spacer" > < / div >
2022-11-02 07:03:05 +01:00
< div id = "footer" >
2022-11-09 05:19:31 +01:00
< div class = "line-separator" > < / div >
2022-10-18 16:48:56 +02:00
< p > If you found this project useful and want to help keep it alive, please < a href = "https://ko-fi.com/cmdr2_stablediffusion_ui" target = "_blank" > < img src = "/media/images/kofi.png" id = "coffeeButton" > < / a > to help cover the cost of development and maintenance! Thank you for your support!< / p >
2022-09-05 14:33:19 +02:00
< p > Please feel free to join the < a href = "https://discord.com/invite/u9yhsFmEkB" target = "_blank" > discord community< / a > or < a href = "https://github.com/cmdr2/stable-diffusion-ui/issues" target = "_blank" > file an issue< / a > if you have any problems or suggestions in using this interface.< / p >
2022-09-02 10:28:36 +02:00
< div id = "footer-legal" >
< p > < b > Disclaimer:< / b > The authors of this project are not responsible for any content generated using this interface.< / p >
< p > This license of this software forbids you from sharing any content that violates any laws, produce any harm to a person, disseminate any personal information that would be meant for harm, < br / > spread misinformation and target vulnerable groups. For the full list of restrictions please read < a href = "https://github.com/cmdr2/stable-diffusion-ui/blob/main/LICENSE" target = "_blank" > the license< / a > .< / p >
< p > By using this software, you consent to the terms and conditions of the license.< / p >
< / div >
< / div >
< / div >
< / body >
2022-11-18 13:01:20 +01:00
< script src = "media/js/utils.js" > < / script >
2022-12-06 12:34:08 +01:00
< script src = "media/js/engine.js" > < / script >
2022-11-18 13:01:20 +01:00
< script src = "media/js/parameters.js" > < / script >
< script src = "media/js/plugins.js" > < / script >
2022-12-06 12:34:08 +01:00
2022-11-18 13:01:20 +01:00
< script src = "media/js/image-modifiers.js" > < / script >
< script src = "media/js/auto-save.js" > < / script >
2022-12-06 12:34:08 +01:00
2023-02-12 10:18:09 +01:00
< script src = "media/js/searchable-models.js" > < / script >
2022-11-18 13:01:20 +01:00
< script src = "media/js/main.js" > < / script >
< script src = "media/js/themes.js" > < / script >
< script src = "media/js/dnd.js" > < / script >
2022-12-01 11:31:09 +01:00
< script src = "media/js/image-editor.js" > < / script >
2023-03-15 02:43:49 +01:00
< script src = "media/js/image-modal.js" > < / script >
2022-09-02 10:28:36 +02:00
< script >
async function init() {
2022-10-20 06:12:01 +02:00
await initSettings()
await getModels()
2022-09-09 17:04:32 +02:00
await getAppConfig()
2022-10-19 18:04:40 +02:00
await loadUIPlugins()
2022-11-23 04:04:20 +01:00
await loadModifiers()
2022-11-30 10:04:24 +01:00
await getSystemInfo()
2022-09-02 10:28:36 +02:00
2022-12-06 12:34:08 +01:00
SD.init({
events: {
2023-03-16 07:12:31 +01:00
statusChange: setServerStatus,
idle: onIdle
2022-12-06 12:34:08 +01:00
}
})
2022-09-09 17:35:24 +02:00
playSound()
2022-09-02 10:28:36 +02:00
}
init()
< / script >
< / html >
