Inovative commited on
Commit
be2a237
·
verified ·
1 Parent(s): 3a8a149

Upload 3 files

Browse files
Files changed (3) hide show
  1. Demo_Screenshort.html +102 -0
  2. app.py +73 -0
  3. requirements.txt +7 -0
Demo_Screenshort.html ADDED
@@ -0,0 +1,102 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <!-- saved from url=(0039)https://01e2460216321bf8ae.gradio.live/ -->
3
+ <html lang="en" style="
4
+ margin: 0;
5
+ padding: 0;
6
+ min-height: 100%;
7
+ display: flex;
8
+ flex-direction: column;
9
+ "><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
10
+
11
+ <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
12
+ <meta property="og:title" content="Gradio">
13
+ <meta property="og:type" content="website">
14
+ <meta property="og:url" content="{url}">
15
+ <meta property="og:description" content="Click to try out the app!">
16
+ <meta property="og:image" content="https://raw.githubusercontent.com/gradio-app/gradio/main/js/_website/src/lib/assets/img/header-image.jpg">
17
+ <meta name="twitter:card" content="summary_large_image">
18
+ <meta name="twitter:creator" content="@Gradio">
19
+ <meta name="twitter:title" content="Gradio">
20
+ <meta name="twitter:description" content="Click to try out the app!">
21
+ <meta name="twitter:image" content="https://raw.githubusercontent.com/gradio-app/gradio/main/js/_website/src/lib/assets/img/header-image.jpg">
22
+
23
+ <style>
24
+ :root {
25
+ --bg: #f9fafb;
26
+ --col: #1f2937;
27
+ --bg-dark: #0b0f19;
28
+ --col-dark: #f3f4f6;
29
+ }
30
+
31
+
32
+ body {
33
+ background: var(--bg);
34
+ color: var(--col);
35
+ font-family: Arial, Helvetica, sans-serif;
36
+ }
37
+
38
+ @media (prefers-color-scheme: dark) {
39
+ body {
40
+ background: var(--bg-dark);
41
+ color: var(--col-dark);
42
+ }
43
+ }
44
+ </style>
45
+
46
+ <meta property="og:url" content="https://gradio.app/">
47
+ <meta property="og:type" content="website">
48
+ <meta property="og:image" content="">
49
+ <meta property="og:title" content="Gradio">
50
+ <meta property="og:description" content="">
51
+ <meta name="twitter:card" content="summary_large_image">
52
+ <meta name="twitter:creator" content="@teamGradio">
53
+ <meta name="twitter:title" content="Gradio">
54
+ <meta name="twitter:description" content="">
55
+ <meta name="twitter:image" content="">
56
+
57
+ <script data-gradio-mode="">
58
+ window.__gradio_mode__ = "app";
59
+ window.iFrameResizer = {
60
+ heightCalculationMethod: "taggedElement"
61
+ };
62
+ window.parent?.postMessage(
63
+ { type: "SET_SCROLLING", enabled: false },
64
+ "*"
65
+ );
66
+ </script>
67
+
68
+ <script>window.gradio_config = {"version":"5.39.0","api_prefix":"/gradio_api","mode":"blocks","app_id":12836690910342267500,"dev_mode":false,"analytics_enabled":true,"components":[{"id":1,"type":"markdown","props":{"value":"## 🎨 Text-to-Image Generator with Stable Diffusion 2.1","show_label":false,"rtl":false,"latex_delimiters":[{"left":"$$","right":"$$","display":true}],"visible":true,"elem_classes":[],"preserved_by_key":["value"],"sanitize_html":true,"line_breaks":false,"header_links":false,"show_copy_button":false,"container":false,"padding":false,"name":"markdown","_selectable":false},"skip_api":false,"component_class_id":"b7a6e6c435401ca3094c4f699ae7bb85bd7b9c14ccde1519b5e932283b6fb9a3","key":null,"api_info":{"type":"string"},"api_info_as_input":{"type":"string"},"api_info_as_output":{"type":"string"},"example_inputs":"# Hello!"},{"id":2,"type":"markdown","props":{"value":"Type your prompt or select an example below to generate high-quality images.","show_label":false,"rtl":false,"latex_delimiters":[{"left":"$$","right":"$$","display":true}],"visible":true,"elem_classes":[],"preserved_by_key":["value"],"sanitize_html":true,"line_breaks":false,"header_links":false,"show_copy_button":false,"container":false,"padding":false,"name":"markdown","_selectable":false},"skip_api":false,"component_class_id":"b7a6e6c435401ca3094c4f699ae7bb85bd7b9c14ccde1519b5e932283b6fb9a3","key":null,"api_info":{"type":"string"},"api_info_as_input":{"type":"string"},"api_info_as_output":{"type":"string"},"example_inputs":"# Hello!"},{"id":3,"type":"row","props":{"variant":"default","visible":true,"equal_height":false,"show_progress":false,"preserved_by_key":[],"name":"row"},"skip_api":true,"component_class_id":"8835eebedcfe056ffec4c8e24ca2de2ca6a61a1304698c2d8470dbcf8e526f6c","key":null},{"id":4,"type":"textbox","props":{"type":"text","lines":1,"placeholder":"e.g. A girl sitting on a hill in a summer breeze 🌼","label":"Enter your prompt","show_label":true,"container":true,"min_width":160,"visible":true,"autofocus":false,"autoscroll":true,"elem_classes":[],"preserved_by_key":["value"],"rtl":false,"show_copy_button":false,"submit_btn":false,"stop_btn":false,"name":"textbox","_selectable":false},"skip_api":false,"component_class_id":"82df6a324e4f5fa23a46e0bf0e3e3d16554ef443809757dce5d12f86330ad480","key":null,"api_info":{"type":"string"},"api_info_as_input":{"type":"string"},"api_info_as_output":{"type":"string"},"example_inputs":"Hello!!"},{"id":5,"type":"button","props":{"value":"🚀 Generate Image","variant":"secondary","size":"lg","visible":true,"interactive":true,"elem_classes":[],"preserved_by_key":["value"],"name":"button","_selectable":false},"skip_api":true,"component_class_id":"363b61ed1b7123689461a90a287421036ed63896f7ed9355bd85edd004ada922","key":null},{"id":6,"type":"form","props":{"scale":1,"min_width":160,"preserved_by_key":[],"name":"form"},"skip_api":true,"component_class_id":"9291fe1e7aa75e1676d9de742c61ffe42870c83e77c73a75e652beb5188c3117","key":null},{"id":7,"type":"row","props":{"variant":"default","visible":true,"equal_height":false,"show_progress":false,"preserved_by_key":[],"name":"row"},"skip_api":true,"component_class_id":"8835eebedcfe056ffec4c8e24ca2de2ca6a61a1304698c2d8470dbcf8e526f6c","key":null},{"id":8,"type":"column","props":{"scale":1,"min_width":320,"variant":"default","visible":true,"show_progress":false,"preserved_by_key":[],"name":"column"},"skip_api":true,"component_class_id":"204089b24e8818ac9b913c8d4531af80a6d5c157b7d6eed3b92894eff41033c0","key":null},{"id":9,"type":"image","props":{"streamable":false,"format":"webp","image_mode":"RGB","sources":["upload","webcam","clipboard"],"type":"filepath","label":"Generated Image","show_label":true,"show_download_button":true,"container":true,"min_width":160,"interactive":false,"visible":true,"streaming":false,"elem_classes":[],"preserved_by_key":["value"],"webcam_options":{"mirror":true,"constraints":null},"show_share_button":false,"show_fullscreen_button":true,"name":"image","_selectable":false},"skip_api":false,"component_class_id":"5442d4bdcbd30c01729a165caff8196956d20f9718be11a4d1879d3c532bb5f7","key":null,"api_info":{"properties":{"path":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"description":"Path to a local file","title":"Path"},"url":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"description":"Publicly available url or base64 encoded image","title":"Url"},"size":{"anyOf":[{"type":"integer"},{"type":"null"}],"default":null,"description":"Size of image in bytes","title":"Size"},"orig_name":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"description":"Original filename","title":"Orig Name"},"mime_type":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"description":"mime type of image","title":"Mime Type"},"is_stream":{"default":false,"description":"Can always be set to False","title":"Is Stream","type":"boolean"},"meta":{"additionalProperties":true,"default":{"_type":"gradio.FileData"},"title":"Meta","type":"object"}},"title":"ImageData","type":"object","additional_description":"For input, either path or url must be provided. For output, path is always provided."},"api_info_as_input":{"properties":{"path":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"description":"Path to a local file","title":"Path"},"url":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"description":"Publicly available url or base64 encoded image","title":"Url"},"size":{"anyOf":[{"type":"integer"},{"type":"null"}],"default":null,"description":"Size of image in bytes","title":"Size"},"orig_name":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"description":"Original filename","title":"Orig Name"},"mime_type":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"description":"mime type of image","title":"Mime Type"},"is_stream":{"default":false,"description":"Can always be set to False","title":"Is Stream","type":"boolean"},"meta":{"additionalProperties":true,"default":{"_type":"gradio.FileData"},"title":"Meta","type":"object"}},"title":"ImageData","type":"object","additional_description":"For input, either path or url must be provided. For output, path is always provided."},"api_info_as_output":{"properties":{"path":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"description":"Path to a local file","title":"Path"},"url":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"description":"Publicly available url or base64 encoded image","title":"Url"},"size":{"anyOf":[{"type":"integer"},{"type":"null"}],"default":null,"description":"Size of image in bytes","title":"Size"},"orig_name":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"description":"Original filename","title":"Orig Name"},"mime_type":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"description":"mime type of image","title":"Mime Type"},"is_stream":{"default":false,"description":"Can always be set to False","title":"Is Stream","type":"boolean"},"meta":{"additionalProperties":true,"default":{"_type":"gradio.FileData"},"title":"Meta","type":"object"}},"title":"ImageData","type":"object","additional_description":"For input, either path or url must be provided. For output, path is always provided."},"example_inputs":{"path":"https://raw.githubusercontent.com/gradio-app/gradio/main/test/test_files/bus.png","meta":{"_type":"gradio.FileData"},"orig_name":"bus.png","url":"https://raw.githubusercontent.com/gradio-app/gradio/main/test/test_files/bus.png"}},{"id":10,"type":"file","props":{"file_count":"single","type":"filepath","label":"Download Image","show_label":true,"container":true,"min_width":160,"visible":true,"elem_classes":[],"preserved_by_key":["value"],"allow_reordering":false,"name":"file","_selectable":false},"skip_api":false,"component_class_id":"43600b8e7688d6fe563c220bbbd053a9a08bf08010ced39b35b5ea4eb22d4886","key":null,"api_info":{"$defs":{"FileDataMeta":{"properties":{"_type":{"const":"gradio.FileData","title":"Type","type":"string"}},"required":["_type"],"title":"FileDataMeta","type":"object"}},"properties":{"path":{"title":"Path","type":"string"},"url":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"title":"Url"},"size":{"anyOf":[{"type":"integer"},{"type":"null"}],"default":null,"title":"Size"},"orig_name":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"title":"Orig Name"},"mime_type":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"title":"Mime Type"},"is_stream":{"default":false,"title":"Is Stream","type":"boolean"},"meta":{"$ref":"#/$defs/FileDataMeta"}},"required":["path"],"title":"FileData","type":"object","additional_description":"The FileData class is a subclass of the GradioModel class that represents a file object within a Gradio interface. It is used to store file data and metadata when a file is uploaded.\n\nAttributes:\n path: The server file path where the file is stored.\n url: The normalized server URL pointing to the file.\n size: The size of the file in bytes.\n orig_name: The original filename before upload.\n mime_type: The MIME type of the file.\n is_stream: Indicates whether the file is a stream.\n meta: Additional metadata used internally (should not be changed)."},"api_info_as_input":{"$defs":{"FileDataMeta":{"properties":{"_type":{"const":"gradio.FileData","title":"Type","type":"string"}},"required":["_type"],"title":"FileDataMeta","type":"object"}},"properties":{"path":{"title":"Path","type":"string"},"url":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"title":"Url"},"size":{"anyOf":[{"type":"integer"},{"type":"null"}],"default":null,"title":"Size"},"orig_name":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"title":"Orig Name"},"mime_type":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"title":"Mime Type"},"is_stream":{"default":false,"title":"Is Stream","type":"boolean"},"meta":{"$ref":"#/$defs/FileDataMeta"}},"required":["path"],"title":"FileData","type":"object","additional_description":"The FileData class is a subclass of the GradioModel class that represents a file object within a Gradio interface. It is used to store file data and metadata when a file is uploaded.\n\nAttributes:\n path: The server file path where the file is stored.\n url: The normalized server URL pointing to the file.\n size: The size of the file in bytes.\n orig_name: The original filename before upload.\n mime_type: The MIME type of the file.\n is_stream: Indicates whether the file is a stream.\n meta: Additional metadata used internally (should not be changed)."},"api_info_as_output":{"$defs":{"FileDataMeta":{"properties":{"_type":{"const":"gradio.FileData","title":"Type","type":"string"}},"required":["_type"],"title":"FileDataMeta","type":"object"}},"properties":{"path":{"title":"Path","type":"string"},"url":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"title":"Url"},"size":{"anyOf":[{"type":"integer"},{"type":"null"}],"default":null,"title":"Size"},"orig_name":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"title":"Orig Name"},"mime_type":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"title":"Mime Type"},"is_stream":{"default":false,"title":"Is Stream","type":"boolean"},"meta":{"$ref":"#/$defs/FileDataMeta"}},"required":["path"],"title":"FileData","type":"object","additional_description":"The FileData class is a subclass of the GradioModel class that represents a file object within a Gradio interface. It is used to store file data and metadata when a file is uploaded.\n\nAttributes:\n path: The server file path where the file is stored.\n url: The normalized server URL pointing to the file.\n size: The size of the file in bytes.\n orig_name: The original filename before upload.\n mime_type: The MIME type of the file.\n is_stream: Indicates whether the file is a stream.\n meta: Additional metadata used internally (should not be changed)."},"example_inputs":{"path":"https://github.com/gradio-app/gradio/raw/main/test/test_files/sample_file.pdf","meta":{"_type":"gradio.FileData"},"orig_name":"sample_file.pdf","url":"https://github.com/gradio-app/gradio/raw/main/test/test_files/sample_file.pdf"}},{"id":11,"type":"column","props":{"scale":1,"min_width":320,"variant":"default","visible":true,"show_progress":false,"preserved_by_key":[],"name":"column"},"skip_api":true,"component_class_id":"204089b24e8818ac9b913c8d4531af80a6d5c157b7d6eed3b92894eff41033c0","key":null},{"id":12,"type":"dataset","props":{"show_label":true,"component_props":[{"type":"text","lines":1,"max_lines":null,"placeholder":"e.g. A girl sitting on a hill in a summer breeze 🌼","label":"Enter your prompt","info":null,"show_label":true,"container":true,"scale":null,"min_width":160,"interactive":null,"visible":true,"elem_id":null,"autofocus":false,"autoscroll":true,"elem_classes":[],"key":null,"preserved_by_key":["value"],"text_align":null,"rtl":false,"show_copy_button":false,"max_length":null,"submit_btn":false,"stop_btn":false,"html_attributes":null}],"samples":[["A majestic mountain landscape during sunrise"],["A futuristic cyberpunk city at night with neon lights"],["A photorealistic portrait of a happy Indian woman in a green saree"],["A fantasy dragon flying over a castle at sunset"],["A cat astronaut floating in space"]],"headers":["Enter your prompt"],"type":"tuple","samples_per_page":10,"visible":true,"elem_classes":[],"preserved_by_key":["value"],"container":true,"min_width":160,"name":"dataset","_selectable":false,"components":["textbox"],"component_ids":[4]},"skip_api":false,"component_class_id":"2a9951e1b696571298a333685a7cd5ef6ee56ea87c5db4be77bf303205925755","key":null,"api_info":{"type":"integer","description":"index of selected example"},"api_info_as_input":{"type":"integer","description":"index of selected example"},"api_info_as_output":{"type":"integer","description":"index of selected example"},"example_inputs":0}],"css":"","connect_heartbeat":false,"js":"","head":"","title":"Gradio","space_id":null,"enable_queue":true,"show_error":false,"show_api":true,"is_colab":true,"max_file_size":null,"stylesheets":[],"theme":"soft","protocol":"sse_v3","body_css":{"body_background_fill":"#f9fafb","body_text_color":"#1f2937","body_background_fill_dark":"#0b0f19","body_text_color_dark":"#f3f4f6"},"fill_height":false,"fill_width":false,"theme_hash":"b6e39c0c5598355a2b3395943a060da6d68fc9d0dbbfe87748484f02fc65c22c","pwa":false,"pages":[["","Home"]],"page":{"":{"layout":{"id":0,"children":[{"id":1},{"id":2},{"id":3,"children":[{"id":6,"children":[{"id":4}]},{"id":5}]},{"id":7,"children":[{"id":8,"children":[{"id":9},{"id":10}]},{"id":11,"children":[{"id":12}]}]}]},"components":[1,2,3,4,5,6,7,8,9,10,11,12],"dependencies":[0,1]}},"mcp_server":false,"i18n_translations":null,"dependencies":[{"id":0,"targets":[[12,"click"]],"inputs":[12],"outputs":[4],"backend_fn":true,"js":null,"queue":false,"api_name":"load_example","api_description":null,"scroll_to_output":false,"show_progress":"hidden","show_progress_on":null,"batch":false,"max_batch_size":4,"cancels":[],"types":{"generator":false,"cancel":false},"collects_event_data":false,"trigger_after":null,"trigger_only_on_success":false,"trigger_mode":"once","show_api":false,"rendered_in":null,"render_id":null,"connection":"sse","time_limit":null,"stream_every":0.5,"like_user_message":false,"event_specific_args":null,"js_implementation":null},{"id":1,"targets":[[5,"click"]],"inputs":[4],"outputs":[9,10],"backend_fn":true,"js":null,"queue":true,"api_name":"generate_image","api_description":null,"scroll_to_output":false,"show_progress":"full","show_progress_on":null,"batch":false,"max_batch_size":4,"cancels":[],"types":{"generator":false,"cancel":false},"collects_event_data":false,"trigger_after":null,"trigger_only_on_success":false,"trigger_mode":"once","show_api":true,"rendered_in":null,"render_id":null,"connection":"sse","time_limit":null,"stream_every":0.5,"like_user_message":false,"event_specific_args":null,"js_implementation":null}],"layout":{"id":0,"children":[{"id":1},{"id":2},{"id":3,"children":[{"id":6,"children":[{"id":4}]},{"id":5}]},{"id":7,"children":[{"id":8,"children":[{"id":9},{"id":10}]},{"id":11,"children":[{"id":12}]}]}]},"username":null,"deep_link_state":"none","current_page":"","root":"https://01e2460216321bf8ae.gradio.live"};</script><script>window.gradio_api_info = {"named_endpoints":{"/generate_image":{"parameters":[{"label":"Enter your prompt","parameter_name":"prompt","parameter_has_default":false,"parameter_default":null,"type":{"type":"string"},"python_type":{"type":"str","description":""},"component":"Textbox","example_input":"Hello!!"}],"returns":[{"label":"Generated Image","type":{"properties":{"path":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"description":"Path to a local file","title":"Path"},"url":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"description":"Publicly available url or base64 encoded image","title":"Url"},"size":{"anyOf":[{"type":"integer"},{"type":"null"}],"default":null,"description":"Size of image in bytes","title":"Size"},"orig_name":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"description":"Original filename","title":"Orig Name"},"mime_type":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"description":"mime type of image","title":"Mime Type"},"is_stream":{"default":false,"description":"Can always be set to False","title":"Is Stream","type":"boolean"},"meta":{"additionalProperties":true,"default":{"_type":"gradio.FileData"},"title":"Meta","type":"object"}},"title":"ImageData","type":"object","additional_description":"For input, either path or url must be provided. For output, path is always provided."},"python_type":{"type":"dict(path: str | None (Path to a local file), url: str | None (Publicly available url or base64 encoded image), size: int | None (Size of image in bytes), orig_name: str | None (Original filename), mime_type: str | None (mime type of image), is_stream: bool (Can always be set to False), meta: dict(str, Any))","description":""},"component":"Image"},{"label":"Download Image","type":{"$defs":{"FileDataMeta":{"properties":{"_type":{"const":"gradio.FileData","title":"Type","type":"string"}},"required":["_type"],"title":"FileDataMeta","type":"object"}},"properties":{"path":{"title":"Path","type":"string"},"url":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"title":"Url"},"size":{"anyOf":[{"type":"integer"},{"type":"null"}],"default":null,"title":"Size"},"orig_name":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"title":"Orig Name"},"mime_type":{"anyOf":[{"type":"string"},{"type":"null"}],"default":null,"title":"Mime Type"},"is_stream":{"default":false,"title":"Is Stream","type":"boolean"},"meta":{"$ref":"#/$defs/FileDataMeta"}},"required":["path"],"title":"FileData","type":"object","additional_description":"The FileData class is a subclass of the GradioModel class that represents a file object within a Gradio interface. It is used to store file data and metadata when a file is uploaded.\n\nAttributes:\n path: The server file path where the file is stored.\n url: The normalized server URL pointing to the file.\n size: The size of the file in bytes.\n orig_name: The original filename before upload.\n mime_type: The MIME type of the file.\n is_stream: Indicates whether the file is a stream.\n meta: Additional metadata used internally (should not be changed)."},"python_type":{"type":"filepath","description":""},"component":"File"}],"show_api":true,"description":""}},"unnamed_endpoints":{}};</script>
69
+
70
+ <link rel="preconnect" href="https://fonts.googleapis.com/">
71
+ <link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin="anonymous">
72
+ <script src="./Demo_Screenshort_files/iframeResizer.contentWindow.min.js.download" async=""></script>
73
+
74
+ <link rel="manifest" href="https://01e2460216321bf8ae.gradio.live/manifest.json">
75
+ <script type="module" crossorigin="" src="./Demo_Screenshort_files/gradio.js.download"></script>
76
+
77
+ <link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Index-BJo1nj4S.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Embed-HnJWX_lT.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/index-B1FJGuzG.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/StreamingBar.svelte_svelte_type_style_lang-DyfAPhwM.js"><link rel="stylesheet" href="./Demo_Screenshort_files/StreamingBar-pGVW9eBG.css"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/MarkdownCode.svelte_svelte_type_style_lang-Cf_zCqIz.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/prism-python-MMh3z1bK.js"><link rel="stylesheet" href="./Demo_Screenshort_files/MarkdownCode-GC7vPJ5f.css"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/IconButton-C_HS7fTi.js"><link rel="stylesheet" href="./Demo_Screenshort_files/IconButtonWrapper-BqcF4N5S.css"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Clear-By3xiIwg.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/DownloadLink.svelte_svelte_type_style_lang-C_5UIfol.js"><link rel="stylesheet" href="./Demo_Screenshort_files/DownloadLink-CqD3Uu0l.css"><link rel="stylesheet" href="./Demo_Screenshort_files/Index-BJ_RfjVB.css"><link rel="stylesheet" href="./Demo_Screenshort_files/index-CJsBH6a-.css"><link rel="stylesheet" href="./Demo_Screenshort_files/theme.css"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Blocks-DQBXfWaA.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/index-B7J2Z2jS.js"><link rel="stylesheet" href="./Demo_Screenshort_files/index-CJsBH6a-(1).css"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Toast-BMPuxKCO.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/index-CEGzm7H5.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/utils-BsGrhMNe.js"><link rel="stylesheet" href="./Demo_Screenshort_files/Blocks-B6OQoqZ7.css"><title>Gradio</title><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Index-DsYu4Vp2.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Check-CEkiXcyC.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Copy-CxQ9EyK2.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/MarkdownCode-CkSMBRHJ.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/IconButtonWrapper--EIOWuEM.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Block-CJdXVpa7.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Example-CyYX3U0b.js"><link rel="stylesheet" href="./Demo_Screenshort_files/Example-D7K5RtQ2.css"><link rel="stylesheet" href="./Demo_Screenshort_files/Index-BTXaMQgd.css"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Index-EtmCJbY4.js"><link rel="stylesheet" href="./Demo_Screenshort_files/Index-CfowPFmo.css"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Index-C5yNnGyH.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Textbox-kv26zexc.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/BlockTitle-Ct-h8ev5.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Info-IGMCDo7y.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Send-DyoOovnk.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Square-oAGqOwsh.js"><link rel="stylesheet" href="./Demo_Screenshort_files/Textbox-jWD3sCxr.css"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Example-BdAjEacD.js"><link rel="stylesheet" href="./Demo_Screenshort_files/Example-ClKJOMGh.css"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Index-FxnluDmK.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Button-B3gqVEq2.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Image-CnqB5dbD.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/file-url-DoxvUUVV.js"><link rel="stylesheet" href="./Demo_Screenshort_files/Image-B8dFOee4.css"><link rel="stylesheet" href="./Demo_Screenshort_files/Button-DTh9AgeE.css"><link rel="stylesheet" href="./Demo_Screenshort_files/ImagePreview-C_qhEOxI.css"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Index-DE1Sah7F.js"><link rel="stylesheet" href="./Demo_Screenshort_files/Index-12OnbRhk.css"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Index-C7inCcrM.js"><link rel="stylesheet" href="./Demo_Screenshort_files/Index-D-5U5m91.css"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Index-BLHCXS_b.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/ImagePreview-lAInKGA8.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/BlockLabel-3KxTaaiM.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Empty-ZqppqzTN.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/ShareButton-BuIiIMKb.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Community-Dw1micSV.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Download-DVtk-Jv3.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Image-Bsh8Umrh.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/FullscreenButton-jgOGhOHz.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/utils-Gtzs_Zla.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/DownloadLink-QIttOhoR.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/ImageUploader-CGsNpf2-.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/SelectSource-CVJruJ8L.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Upload-D4uXt6Nz.js"><link rel="stylesheet" href="./Demo_Screenshort_files/Upload-L7mprsyN.css"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/DropdownArrow-DYWFcSFn.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/StreamingBar-JqJtcvLZ.js"><link rel="stylesheet" href="./Demo_Screenshort_files/ImageUploader-DMdYP1a9.css"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/UploadText-DtO3Yo94.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Example-CC8yxxGn.js"><link rel="stylesheet" href="./Demo_Screenshort_files/Example-DikqVAPo.css"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Index-BH3WSrmS.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/FileUpload-3WZGI66M.js"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/File-BQ_9P3Ye.js"><link rel="stylesheet" href="./Demo_Screenshort_files/FileUpload-CQVu-hjH.css"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Example-DrmWnoSo.js"><link rel="stylesheet" href="./Demo_Screenshort_files/Example-DpWs9cEC.css"><link rel="modulepreload" as="script" crossorigin="" href="https://gradio.s3-us-west-2.amazonaws.com/5.39.0/assets/Index-loH_ztvM.js"><link rel="stylesheet" href="./Demo_Screenshort_files/Index-D3f6Hf9S.css"></head>
78
+
79
+ <body style="
80
+ width: 100%;
81
+ margin: 0;
82
+ padding: 0;
83
+ display: flex;
84
+ flex-direction: column;
85
+ flex-grow: 1;
86
+ ">
87
+ <gradio-app control_page_title="true" embed="false" eager="true" style="display: flex; flex-direction: column; flex-grow: 1; background: var(--body-background-fill);">
88
+ <div class="gradio-container gradio-container-5-39-0 svelte-1anp163" data-iframe-height="" style="min-height: initial; flex-grow: 1;"> <main class="fillable svelte-1anp163 app"> <div class="wrap svelte-czcr5b" style="min-height: 100%;"><div class="contain svelte-czcr5b" style="flex-grow: 1;"><div id="component-0" class="column svelte-bnzux8" style="min-width: min(0px, 100%);"> <div id="component-1" class="block svelte-1svsvh2 padded hide-container auto-margin" dir="ltr" style="--start-top: 0px; --start-left: 0px; --start-width: 0px; --start-height: 0px; border-style: solid; overflow: auto; min-width: min(0px, 100%); border-width: var(--block-border-width);"><div class="wrap center full svelte-ls20lj hide" style="position: absolute; padding: 0px;"></div> <div class="svelte-vuh1yp"><div class="prose svelte-lag733" data-testid="markdown" dir="ltr" style=""> <span class="md svelte-7ddecg prose"><h2>🎨 Text-to-Image Generator with Stable Diffusion 2.1</h2>
89
+ </span></div></div> </div> <div id="component-2" class="block svelte-1svsvh2 padded hide-container auto-margin" dir="ltr" style="--start-top: 0px; --start-left: 0px; --start-width: 0px; --start-height: 0px; border-style: solid; overflow: auto; min-width: min(0px, 100%); border-width: var(--block-border-width);"><div class="wrap center full svelte-ls20lj hide" style="position: absolute; padding: 0px;"></div> <div class="svelte-vuh1yp"><div class="prose svelte-lag733" data-testid="markdown" dir="ltr" style=""> <span class="md svelte-7ddecg prose"><p>Type your prompt or select an example below to generate high-quality images.</p>
90
+ </span></div></div> </div> <div id="component-3" class="row svelte-1xp0cw7 unequal-height"> <div class="form svelte-633qhp" style="flex-grow: 1; min-width: min(160px, 100%);"><div id="component-4" class="block svelte-1svsvh2 padded auto-margin" dir="ltr" style="--start-top: 0px; --start-left: 0px; --start-width: 0px; --start-height: 0px; border-style: solid; overflow: hidden; min-width: min(160px, 100%); border-width: var(--block-border-width);"><div class="wrap default hidden svelte-ls20lj hide" style="position: absolute; padding: 0px;"></div> <label class="svelte-173056l container show_textbox_border"> <span data-testid="block-info" dir="ltr" class="svelte-g2oxp3">Enter your prompt</span> <div class="input-container svelte-173056l"><textarea data-testid="textbox" dir="ltr" placeholder="e.g. A girl sitting on a hill in a summer breeze 🌼" rows="1" style="overflow-y: hidden; height: 40px;" class="svelte-173056l"></textarea> </div></label> </div> </div><button class="lg secondary svelte-1ixn6qd" id="component-5"> 🚀 Generate Image</button></div><div id="component-7" class="row svelte-1xp0cw7 unequal-height"> <div id="component-8" class="column svelte-bnzux8" style="flex-grow: 1; min-width: min(320px, 100%);"> <div id="component-9" class="block svelte-1svsvh2 auto-margin" dir="ltr" style="--start-top: 0px; --start-left: 0px; --start-width: 0px; --start-height: 0px; border-style: solid; overflow: hidden; min-width: min(160px, 100%); border-width: var(--block-border-width);"><div class="wrap default full svelte-ls20lj hide" style="position: absolute; padding: 0px;"></div> <label for="" data-testid="block-label" dir="ltr" class="svelte-1to105q float"><span class="svelte-1to105q"><svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="feather feather-image"><rect x="3" y="3" width="18" height="18" rx="2" ry="2"></rect><circle cx="8.5" cy="8.5" r="1.5"></circle><polyline points="21 15 16 10 5 21"></polyline></svg></span> Generated Image</label> <div class="image-container svelte-zxsjoa"><div class="icon-button-wrapper top-panel hide-top-corner svelte-9lsba8"><button aria-label="Fullscreen" aria-haspopup="false" title="Fullscreen" class="svelte-vzs2gq padded" style="color: var(--block-label-text-color); --bg-color: var(--block-background-fill);"> <div class="svelte-vzs2gq small"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-maximize" width="100%" height="100%"><path d="M8 3H5a2 2 0 0 0-2 2v3m18 0V5a2 2 0 0 0-2-2h-3m0 18h3a2 2 0 0 0 2-2v-3M3 16v3a2 2 0 0 0 2 2h3"></path></svg> </div></button> <a class="download-link svelte-1s8vnbx" href="./Demo_Screenshort_files/image.webp" target="_blank" rel="noopener noreferrer" download="image.webp" style="position: relative;"><button aria-label="Download" aria-haspopup="false" title="Download" class="svelte-vzs2gq padded" style="color: var(--block-label-text-color); --bg-color: var(--block-background-fill);"> <div class="svelte-vzs2gq small"><svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 32 32"><path fill="currentColor" d="M26 24v4H6v-4H4v4a2 2 0 0 0 2 2h20a2 2 0 0 0 2-2v-4zm0-10l-1.41-1.41L17 20.17V2h-2v18.17l-7.59-7.58L6 14l10 10l10-10z"></path></svg> </div></button></a> </div> <button class="svelte-zxsjoa"><div class="image-frame svelte-zxsjoa"><img src="./Demo_Screenshort_files/image.webp" alt="" loading="lazy" class="svelte-1pijsyv"></div></button></div> </div> <div id="component-10" class="block svelte-1svsvh2 auto-margin" dir="ltr" style="--start-top: 0px; --start-left: 0px; --start-width: 0px; --start-height: 0px; border-style: solid; overflow: hidden; min-width: min(160px, 100%); border-width: var(--block-border-width);"><div class="wrap default full svelte-ls20lj hide" style="position: absolute; padding: 0px;"></div> <label for="" data-testid="block-label" dir="ltr" class="svelte-1to105q"><span class="svelte-1to105q"><svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="feather feather-file"><path d="M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z"></path><polyline points="13 2 13 9 20 9"></polyline></svg></span> Download Image</label> <div class="file-preview-holder svelte-1rvzbk6"><table class="file-preview svelte-1rvzbk6"><tbody class="svelte-1rvzbk6"><tr class="file svelte-1rvzbk6" data-drop-target="before" draggable="false"><td class="filename svelte-1rvzbk6" aria-label="A_majestic_mountain_landscape_during_sunrise_f10c35.png"> <span class="stem svelte-1rvzbk6">A_majestic_mountain_landscape_during_sunrise_f10c35</span> <span class="ext svelte-1rvzbk6">.png</span></td> <td class="download svelte-1rvzbk6"><a class="download-link svelte-1s8vnbx" href="https://01e2460216321bf8ae.gradio.live/gradio_api/file=/tmp/gradio/266ec70560f2d4872b28647cfa23948b51613406370433dc9979f2cffaa288ae/A_majestic_mountain_landscape_during_sunrise_f10c35.png" target="_blank" rel="noopener noreferrer" style="position: relative;">992.9&nbsp;KB&nbsp;⇣</a></td> </tr></tbody></table></div> </div> </div><div id="component-11" class="column svelte-bnzux8" style="flex-grow: 1; min-width: min(320px, 100%);"> <div id="component-12" class="block svelte-1svsvh2 hide-container auto-margin" dir="ltr" style="--start-top: 0px; --start-left: 0px; --start-width: 0px; --start-height: 0px; border-style: solid; overflow: hidden; min-width: min(160px, 100%); border-width: var(--block-border-width);"><div class="label svelte-p5q82i"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32" class="svelte-p5q82i"><path fill="currentColor" d="M10 6h18v2H10zm0 18h18v2H10zm0-9h18v2H10zm-6 0h2v2H4zm0-9h2v2H4zm0 18h2v2H4z"></path></svg> Examples</div> <div class="gallery svelte-p5q82i"><button class="gallery-item svelte-p5q82i"><div class="svelte-1oitfqa gallery" style="position: relative; --local-text-width: 200px; white-space: unset;">A majestic mountain landscape during sunrise<iframe style="display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; border: 0; opacity: 0; pointer-events: none; z-index: -1;" aria-hidden="true" tabindex="-1" src="./Demo_Screenshort_files/saved_resource.html"></iframe></div> </button><button class="gallery-item svelte-p5q82i"><div class="svelte-1oitfqa gallery" style="position: relative; --local-text-width: 200px; white-space: unset;">A futuristic cyberpunk city at night with neon lights<iframe style="display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; border: 0; opacity: 0; pointer-events: none; z-index: -1;" aria-hidden="true" tabindex="-1" src="./Demo_Screenshort_files/saved_resource(1).html"></iframe></div> </button><button class="gallery-item svelte-p5q82i"><div class="svelte-1oitfqa gallery" style="position: relative; --local-text-width: 200px; white-space: unset;">A photorealistic portrait of a happy Indian woman in a green...<iframe style="display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; border: 0; opacity: 0; pointer-events: none; z-index: -1;" aria-hidden="true" tabindex="-1" src="./Demo_Screenshort_files/saved_resource(2).html"></iframe></div> </button><button class="gallery-item svelte-p5q82i"><div class="svelte-1oitfqa gallery" style="position: relative; --local-text-width: 200px; white-space: unset;">A fantasy dragon flying over a castle at sunset<iframe style="display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; border: 0; opacity: 0; pointer-events: none; z-index: -1;" aria-hidden="true" tabindex="-1" src="./Demo_Screenshort_files/saved_resource(3).html"></iframe></div> </button><button class="gallery-item svelte-p5q82i"><div class="svelte-1oitfqa gallery" style="position: relative; --local-text-width: 200px; white-space: unset;">A cat astronaut floating in space<iframe style="display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; border: 0; opacity: 0; pointer-events: none; z-index: -1;" aria-hidden="true" tabindex="-1" src="./Demo_Screenshort_files/saved_resource(4).html"></iframe></div> </button></div> </div> </div></div></div></div> <footer class="svelte-czcr5b"><button class="show-api svelte-czcr5b">Use via API <img src="data:image/svg+xml,%3csvg%20width=&#39;28&#39;%20height=&#39;28&#39;%20viewBox=&#39;0%200%2028%2028&#39;%20fill=&#39;none&#39;%20xmlns=&#39;http://www.w3.org/2000/svg&#39;%3e%3cpath%20fill-rule=&#39;evenodd&#39;%20clip-rule=&#39;evenodd&#39;%20d=&#39;M26.9425%202.94265C27.4632%202.42195%2027.4632%201.57773%2026.9425%201.05703C26.4218%200.536329%2025.5776%200.536329%2025.0569%201.05703L22.5713%203.54256C21.1213%202.59333%2019.5367%202.43378%2018.1753%202.64006C16.5495%202.88638%2015.1127%203.66838%2014.3905%204.39053L12.3905%206.39053C12.1405%206.64058%2012%206.97972%2012%207.33334C12%207.68697%2012.1405%208.0261%2012.3905%208.27615L19.7239%2015.6095C20.2446%2016.1302%2021.0888%2016.1302%2021.6095%2015.6095L23.6095%2013.6095C24.3316%2012.8873%2025.1136%2011.4505%2025.36%209.82475C25.5663%208.46312%2025.4066%206.87827%2024.4571%205.42807L26.9425%202.94265Z&#39;%20fill=&#39;%233c4555&#39;/%3e%3cpath%20fill-rule=&#39;evenodd&#39;%20clip-rule=&#39;evenodd&#39;%20d=&#39;M12.276%2012.9426C12.7967%2012.4219%2012.7967%2011.5777%2012.276%2011.057C11.7553%2010.5363%2010.9111%2010.5363%2010.3904%2011.057L8.66651%2012.7809L8.27615%2012.3905C8.0261%2012.1405%207.68697%2012%207.33334%2012C6.97972%2012%206.64058%2012.1405%206.39053%2012.3905L4.39053%2014.3905C3.66838%2015.1127%202.88638%2016.5495%202.64006%2018.1753C2.43377%2019.5367%202.59333%2021.1214%203.54262%2022.5714L1.05703%2025.057C0.536329%2025.5777%200.536329%2026.4219%201.05703%2026.9426C1.57773%2027.4633%202.42195%2027.4633%202.94265%2026.9426L5.42817%2024.4571C6.87835%2025.4066%208.46315%2025.5663%209.82475%2025.36C11.4505%2025.1136%2012.8873%2024.3316%2013.6095%2023.6095L15.6095%2021.6095C16.1302%2021.0888%2016.1302%2020.2446%2015.6095%2019.7239L15.2188%2019.3332L16.9426%2017.6093C17.4633%2017.0886%2017.4633%2016.2444%2016.9426%2015.7237C16.4219%2015.203%2015.5777%2015.203%2015.057%2015.7237L13.3332%2017.4475L10.5521%2014.6665L12.276%2012.9426Z&#39;%20fill=&#39;%23FF7C00&#39;/%3e%3c/svg%3e" alt="logo" class="svelte-czcr5b"></button> <div class="divider show-api-divider svelte-czcr5b">·</div> <a href="https://gradio.app/" class="built-with svelte-czcr5b" target="_blank" rel="noreferrer">Built with Gradio <img src="data:image/svg+xml,%3csvg%20xmlns=&#39;http://www.w3.org/2000/svg&#39;%20width=&#39;576&#39;%20height=&#39;576&#39;%20viewBox=&#39;0%200%20576%20576&#39;%20fill=&#39;none&#39;%3e%3cpath%20d=&#39;M287.5%20229L86%20344.5L287.5%20460L489%20344.5L287.5%20229Z&#39;%20stroke=&#39;url(%23paint0_linear_102_7)&#39;%20stroke-width=&#39;59&#39;%20stroke-linejoin=&#39;round&#39;/%3e%3cpath%20d=&#39;M287.5%20116L86%20231.5L287.5%20347L489%20231.5L287.5%20116Z&#39;%20stroke=&#39;url(%23paint1_linear_102_7)&#39;%20stroke-width=&#39;59&#39;%20stroke-linejoin=&#39;round&#39;/%3e%3cpath%20d=&#39;M86%20344L288%20229&#39;%20stroke=&#39;url(%23paint2_linear_102_7)&#39;%20stroke-width=&#39;59&#39;%20stroke-linejoin=&#39;bevel&#39;/%3e%3cdefs%3e%3clinearGradient%20id=&#39;paint0_linear_102_7&#39;%20x1=&#39;60&#39;%20y1=&#39;341&#39;%20x2=&#39;429.5&#39;%20y2=&#39;344&#39;%20gradientUnits=&#39;userSpaceOnUse&#39;%3e%3cstop%20stop-color=&#39;%23F9D100&#39;/%3e%3cstop%20offset=&#39;1&#39;%20stop-color=&#39;%23F97700&#39;/%3e%3c/linearGradient%3e%3clinearGradient%20id=&#39;paint1_linear_102_7&#39;%20x1=&#39;513.5&#39;%20y1=&#39;231&#39;%20x2=&#39;143.5&#39;%20y2=&#39;231&#39;%20gradientUnits=&#39;userSpaceOnUse&#39;%3e%3cstop%20stop-color=&#39;%23F9D100&#39;/%3e%3cstop%20offset=&#39;1&#39;%20stop-color=&#39;%23F97700&#39;/%3e%3c/linearGradient%3e%3clinearGradient%20id=&#39;paint2_linear_102_7&#39;%20x1=&#39;60&#39;%20y1=&#39;344&#39;%20x2=&#39;428.987&#39;%20y2=&#39;341.811&#39;%20gradientUnits=&#39;userSpaceOnUse&#39;%3e%3cstop%20stop-color=&#39;%23F9D100&#39;/%3e%3cstop%20offset=&#39;1&#39;%20stop-color=&#39;%23F97700&#39;/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e" alt="logo" class="svelte-czcr5b"></a> <div class="divider svelte-czcr5b hidden">·</div> <button class="record svelte-czcr5b hidden">Stop Recording <img src="data:image/svg+xml,%3csvg%20viewBox=&#39;0%200%2020%2020&#39;%20version=&#39;1.1&#39;%20xmlns=&#39;http://www.w3.org/2000/svg&#39;%20xmlns:xlink=&#39;http://www.w3.org/1999/xlink&#39;%20fill=&#39;%23000000&#39;%3e%3cg%20id=&#39;SVGRepo_bgCarrier&#39;%20stroke-width=&#39;0&#39;%3e%3c/g%3e%3cg%20id=&#39;SVGRepo_tracerCarrier&#39;%20stroke-linecap=&#39;round&#39;%20stroke-linejoin=&#39;round&#39;%3e%3c/g%3e%3cg%20id=&#39;SVGRepo_iconCarrier&#39;%3e%3ctitle%3erecord%20[%23982]%3c/title%3e%3cdesc%3eCreated%20with%20Sketch.%3c/desc%3e%3cdefs%3e%3c/defs%3e%3cg%20id=&#39;Page-1&#39;%20stroke=&#39;none&#39;%20stroke-width=&#39;1&#39;%20fill=&#39;none&#39;%20fill-rule=&#39;evenodd&#39;%3e%3cg%20id=&#39;Dribbble-Light-Preview&#39;%20transform=&#39;translate(-380.000000,%20-3839.000000)&#39;%20fill=&#39;%23FF0000&#39;%3e%3cg%20id=&#39;icons&#39;%20transform=&#39;translate(56.000000,%20160.000000)&#39;%3e%3cpath%20d=&#39;M338,3689%20C338,3691.209%20336.209,3693%20334,3693%20C331.791,3693%20330,3691.209%20330,3689%20C330,3686.791%20331.791,3685%20334,3685%20C336.209,3685%20338,3686.791%20338,3689%20M334,3697%20C329.589,3697%20326,3693.411%20326,3689%20C326,3684.589%20329.589,3681%20334,3681%20C338.411,3681%20342,3684.589%20342,3689%20C342,3693.411%20338.411,3697%20334,3697%20M334,3679%20C328.477,3679%20324,3683.477%20324,3689%20C324,3694.523%20328.477,3699%20334,3699%20C339.523,3699%20344,3694.523%20344,3689%20C344,3683.477%20339.523,3679%20334,3679&#39;%20id=&#39;record-[%23982]&#39;%3e%3c/path%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/svg%3e" alt="Stop Recording" class="svelte-czcr5b"></button> <div class="divider svelte-czcr5b">·</div> <button class="settings svelte-czcr5b">Settings <img src="data:image/svg+xml,%3csvg%20width=&#39;24&#39;%20height=&#39;24&#39;%20viewBox=&#39;0%200%2024%2024&#39;%20xmlns=&#39;http://www.w3.org/2000/svg&#39;%3e%3c!--%20Outer%20gear%20teeth%20(gray)%20--%3e%3cpath%20d=&#39;M19.14%2012.94c.04-.3.06-.61.06-.94%200-.32-.02-.64-.07-.94l2.03-1.58c.18-.14.23-.41.12-.61l-1.92-3.32c-.12-.22-.37-.29-.59-.22l-2.39.96c-.5-.38-1.03-.7-1.62-.94l-.36-2.54c-.04-.24-.24-.41-.48-.41h-3.84c-.24%200-.43.17-.47.41l-.36%202.54c-.59.24-1.13.57-1.62.94l-2.39-.96c-.22-.08-.47%200-.59.22L2.74%208.87c-.12.21-.08.47.12.61l2.03%201.58c-.05.3-.07.62-.07.94s.02.64.07.94l-2.03%201.58c-.18.14-.23.41-.12.61l1.92%203.32c.12.22.37.29.59.22l2.39-.96c.5.38%201.03.7%201.62.94l.36%202.54c.05.24.24.41.48.41h3.84c.24%200%20.44-.17.47-.41l.36-2.54c.59-.24%201.13-.56%201.62-.94l2.39.96c.22.08.47%200%20.59-.22l1.92-3.32c.12-.22.07-.47-.12-.61l-2.01-1.58zM12%2015.6c-1.98%200-3.6-1.62-3.6-3.6s1.62-3.6%203.6-3.6%203.6%201.62%203.6%203.6-1.62%203.6-3.6%203.6z&#39;%20fill=&#39;%23808080&#39;/%3e%3c!--%20Inner%20circle%20(now%20gray)%20--%3e%3ccircle%20cx=&#39;12&#39;%20cy=&#39;12&#39;%20r=&#39;2.5&#39;%20fill=&#39;%23808080&#39;/%3e%3c/svg%3e" alt="Settings" class="svelte-czcr5b"></button></footer></div> <div class="toast-wrap svelte-pu0yf1"></div> <div></div></main></div></gradio-app>
91
+ <script>
92
+ const ce = document.getElementsByTagName("gradio-app");
93
+
94
+ if (ce[0]) {
95
+ ce[0].addEventListener("domchange", () => {
96
+ document.body.style.padding = "0";
97
+ });
98
+ document.body.style.padding = "0";
99
+ }
100
+ </script>
101
+
102
+ </body></html>
app.py ADDED
@@ -0,0 +1,73 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+
2
+ # Install Gradio and dependencies
3
+ !pip install --upgrade gradio diffusers transformers accelerate
4
+
5
+ # --- Imports ---
6
+ from diffusers import StableDiffusionPipeline
7
+ import torch
8
+ import gradio as gr
9
+ import uuid
10
+
11
+ # --- Configuration ---
12
+ class CGF:
13
+ device = "cuda" if torch.cuda.is_available() else "cpu"
14
+ seed = 42
15
+ generator = torch.Generator(device=device).manual_seed(seed)
16
+ image_gen_model_id = "./my_text_to_image_saved_sd_model"
17
+ image_gen_steps = 50
18
+ image_gen_guidance_scale = 10
19
+ image_gen_size = (768, 768)
20
+
21
+ # --- Load Model ---
22
+ pipe = StableDiffusionPipeline.from_pretrained(
23
+ CGF.image_gen_model_id,
24
+ torch_dtype=torch.float16,
25
+ use_safetensors=True,
26
+ revision="fp16",
27
+ ).to(CGF.device)
28
+
29
+ # --- Generation Function ---
30
+ def generate_image(prompt):
31
+ result = pipe(
32
+ prompt,
33
+ num_inference_steps=CGF.image_gen_steps,
34
+ guidance_scale=CGF.image_gen_guidance_scale,
35
+ generator=CGF.generator,
36
+ ).images[0]
37
+
38
+ filename = f"{prompt.replace(' ', '_')}_{uuid.uuid4().hex[:6]}.png"
39
+ result.save(filename)
40
+ return result, filename
41
+
42
+ # --- Gradio UI ---
43
+ examples = [
44
+ "A majestic mountain landscape during sunrise",
45
+ "A futuristic cyberpunk city at night with neon lights",
46
+ "A photorealistic portrait of a happy Indian woman in a green saree",
47
+ "A fantasy dragon flying over a castle at sunset",
48
+ "A cat astronaut floating in space",
49
+ ]
50
+
51
+ with gr.Blocks(theme=gr.themes.Soft()) as demo:
52
+ gr.Markdown("## 🎨 Text-to-Image Generator with Stable Diffusion 2.1")
53
+ gr.Markdown("Type your prompt or select an example below to generate high-quality images.")
54
+
55
+ with gr.Row():
56
+ prompt = gr.Textbox(label="Enter your prompt", placeholder="e.g. A girl sitting on a hill in a summer breeze 🌼")
57
+ generate_btn = gr.Button("🚀 Generate Image")
58
+
59
+ with gr.Row():
60
+ with gr.Column():
61
+ gallery = gr.Image(label="Generated Image", type="filepath", interactive=False)
62
+ download = gr.File(label="Download Image")
63
+
64
+ with gr.Column():
65
+ gr.Examples(examples=examples, inputs=prompt)
66
+
67
+ generate_btn.click(fn=generate_image, inputs=prompt, outputs=[gallery, download])
68
+ # Launch Gradio app with a public link
69
+
70
+ # --- Launch App ---
71
+ demo.launch(share=True)
72
+
73
+
requirements.txt ADDED
@@ -0,0 +1,7 @@
 
 
 
 
 
 
 
 
1
+
2
+ gradio
3
+ torch
4
+ diffusers
5
+ transformers
6
+ accelerate
7
+ safetensors