SD / app.py
ayonofreaky's picture
Upload app.py
6324b19
<!DOCTYPE html>
<html class="">
<head>
<meta charset="utf-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, user-scalable=no"
/>
<meta name="description" content="We’re on a journey to advance and democratize artificial intelligence through open source and open science." />
<meta property="fb:app_id" content="1321688464574422" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@huggingface" />
<meta property="og:title" content="app.py · stabilityai/stable-diffusion at main" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://huggingface.co/spaces/stabilityai/stable-diffusion/blob/main/app.py" />
<meta property="og:image" content="https://thumbnails.huggingface.co/social-thumbnails/spaces/stabilityai/stable-diffusion.png" />
<link rel="stylesheet" href="/front/build/style.7520c4e01.css" />
<link rel="preconnect" href="https://fonts.gstatic.com" />
<link
href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700;1,900&display=swap"
rel="stylesheet"
/>
<link
href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;600;700&display=swap"
rel="stylesheet"
/>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/katex@0.12.0/dist/katex.min.css"
/>
<style data-svelte="svelte-np4f0n">.blob-line-num::before {
content: attr(line-num);
}
</style>
<title>app.py · stabilityai/stable-diffusion at main</title>
</head>
<body
class="flex flex-col min-h-screen bg-white dark:bg-gray-950 text-black ViewerBlobPage"
>
<div class="flex flex-col min-h-screen ">
<div class="SVELTE_HYDRATER contents" data-props="{&quot;avatarUrl&quot;:&quot;/avatars/7428f63dfdeb64f1e1471f043a7a65a6.svg&quot;,&quot;hfCloudName&quot;:&quot;private&quot;,&quot;isAuth&quot;:true,&quot;isHfCloud&quot;:false,&quot;isWide&quot;:false,&quot;user&quot;:&quot;ayonofreaky&quot;,&quot;unreadNotifications&quot;:0,&quot;csrf&quot;:&quot;eyJkYXRhIjp7ImV4cGlyYXRpb24iOjE2NjM1NjQzOTI5NjcsInVzZXJJZCI6IjYzMjQwMDY0OTJlMDdlM2NhMjBhODA1YSJ9LCJzaWduYXR1cmUiOiI4NTE3ODU0YThkZDQ3MzE0NzZhOWQ2NDdjNDIxZjc1MjYyMjQwMzhmNWQzMGI0MGFkNWRiOGZkMGRlZWUxZDAwIn0=&quot;}" data-target="MainHeader"><header class="border-b border-gray-100"><div class="w-full px-4 lg:px-6 xl:container flex items-center h-16"><div class="flex flex-1 items-center"><a class="flex flex-none items-center mr-5 lg:mr-6" href="/"><img alt="Hugging Face's logo" class="md:mr-2 w-7" src="/front/assets/huggingface_logo-noborder.svg">
<span class="hidden text-lg font-bold whitespace-nowrap md:block">Hugging Face</span></a>
<div class="relative flex-1 lg:max-w-sm mr-2 sm:mr-4 lg:mr-6"><input autocomplete="off" class="w-full dark:bg-gray-950 pl-8
form-input-alt h-9 pr-3 focus:shadow-xl" name="" placeholder="Search models, datasets, users..." spellcheck="false" type="text">
<svg class="absolute left-2.5 text-gray-400 top-1/2 transform -translate-y-1/2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path d="M30 28.59L22.45 21A11 11 0 1 0 21 22.45L28.59 30zM5 14a9 9 0 1 1 9 9a9 9 0 0 1-9-9z" fill="currentColor"></path></svg>
</div>
<button class="lg:hidden relative flex-none place-self-stretch flex items-center justify-center w-8" type="button"><svg class="text-xl" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32" fill="currentColor"><path d="M4 24h24v2H4z"></path><path d="M4 12h24v2H4z"></path><path d="M4 18h24v2H4z"></path><path d="M4 6h24v2H4z"></path></svg>
</button>
</div>
<nav aria-label="Main" class="ml-auto hidden lg:block"><ul class="flex items-center space-x-2"><li><a class="flex items-center group px-2 py-0.5 dark:hover:text-gray-400 hover:text-indigo-700" href="/models"><svg class="mr-1.5 text-gray-400 group-hover:text-indigo-500" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path class="uim-quaternary" d="M20.23 7.24L12 12L3.77 7.24a1.98 1.98 0 0 1 .7-.71L11 2.76c.62-.35 1.38-.35 2 0l6.53 3.77c.29.173.531.418.7.71z" opacity=".25" fill="currentColor"></path><path class="uim-tertiary" d="M12 12v9.5a2.09 2.09 0 0 1-.91-.21L4.5 17.48a2.003 2.003 0 0 1-1-1.73v-7.5a2.06 2.06 0 0 1 .27-1.01L12 12z" opacity=".5" fill="currentColor"></path><path class="uim-primary" d="M20.5 8.25v7.5a2.003 2.003 0 0 1-1 1.73l-6.62 3.82c-.275.13-.576.198-.88.2V12l8.23-4.76c.175.308.268.656.27 1.01z" fill="currentColor"></path></svg>
Models</a>
</li><li><a class="flex items-center group px-2 py-0.5 dark:hover:text-gray-400 hover:text-red-700" href="/datasets"><svg class="mr-1.5 text-gray-400 group-hover:text-red-500" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 25 25"><ellipse cx="12.5" cy="5" fill="currentColor" fill-opacity="0.25" rx="7.5" ry="2"></ellipse><path d="M12.5 15C16.6421 15 20 14.1046 20 13V20C20 21.1046 16.6421 22 12.5 22C8.35786 22 5 21.1046 5 20V13C5 14.1046 8.35786 15 12.5 15Z" fill="currentColor" opacity="0.5"></path><path d="M12.5 7C16.6421 7 20 6.10457 20 5V11.5C20 12.6046 16.6421 13.5 12.5 13.5C8.35786 13.5 5 12.6046 5 11.5V5C5 6.10457 8.35786 7 12.5 7Z" fill="currentColor" opacity="0.5"></path><path d="M5.23628 12C5.08204 12.1598 5 12.8273 5 13C5 14.1046 8.35786 15 12.5 15C16.6421 15 20 14.1046 20 13C20 12.8273 19.918 12.1598 19.7637 12C18.9311 12.8626 15.9947 13.5 12.5 13.5C9.0053 13.5 6.06886 12.8626 5.23628 12Z" fill="currentColor"></path></svg>
Datasets</a>
</li><li><a class="flex items-center group px-2 py-0.5 dark:hover:text-gray-400 hover:text-blue-700" href="/spaces"><svg class="mr-1.5 text-gray-400 group-hover:text-blue-500" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" width="1em" height="1em" viewBox="0 0 25 25"><path opacity=".5" d="M6.016 14.674v4.31h4.31v-4.31h-4.31ZM14.674 14.674v4.31h4.31v-4.31h-4.31ZM6.016 6.016v4.31h4.31v-4.31h-4.31Z" fill="currentColor"></path><path opacity=".75" fill-rule="evenodd" clip-rule="evenodd" d="M3 4.914C3 3.857 3.857 3 4.914 3h6.514c.884 0 1.628.6 1.848 1.414a5.171 5.171 0 0 1 7.31 7.31c.815.22 1.414.964 1.414 1.848v6.514A1.914 1.914 0 0 1 20.086 22H4.914A1.914 1.914 0 0 1 3 20.086V4.914Zm3.016 1.102v4.31h4.31v-4.31h-4.31Zm0 12.968v-4.31h4.31v4.31h-4.31Zm8.658 0v-4.31h4.31v4.31h-4.31Zm0-10.813a2.155 2.155 0 1 1 4.31 0 2.155 2.155 0 0 1-4.31 0Z" fill="currentColor"></path><path opacity=".25" d="M16.829 6.016a2.155 2.155 0 1 0 0 4.31 2.155 2.155 0 0 0 0-4.31Z" fill="currentColor"></path></svg>
Spaces</a>
</li><li><a class="flex items-center group px-2 py-0.5 dark:hover:text-gray-400 hover:text-yellow-700" href="/docs"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="mr-1.5 text-gray-400 group-hover:text-yellow-500" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path opacity="0.5" d="M20.9022 5.10334L10.8012 10.8791L7.76318 9.11193C8.07741 8.56791 8.5256 8.11332 9.06512 7.7914L15.9336 3.73907C17.0868 3.08811 18.5002 3.26422 19.6534 3.91519L19.3859 3.73911C19.9253 4.06087 20.5879 4.56025 20.9022 5.10334Z" fill="currentColor"></path><path d="M10.7999 10.8792V28.5483C10.2136 28.5475 9.63494 28.4139 9.10745 28.1578C8.5429 27.8312 8.074 27.3621 7.74761 26.7975C7.42122 26.2327 7.24878 25.5923 7.24756 24.9402V10.9908C7.25062 10.3319 7.42358 9.68487 7.74973 9.1123L10.7999 10.8792Z" fill="currentColor" fill-opacity="0.75"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M21.3368 10.8499V6.918C21.3331 6.25959 21.16 5.61234 20.8346 5.03949L10.7971 10.8727L10.8046 10.874L21.3368 10.8499Z" fill="currentColor"></path><path opacity="0.5" d="M21.7937 10.8488L10.7825 10.8741V28.5486L21.7937 28.5234C23.3344 28.5234 24.5835 27.2743 24.5835 25.7335V13.6387C24.5835 12.0979 23.4365 11.1233 21.7937 10.8488Z" fill="currentColor"></path></svg>
Docs</a>
</li>
<li><div class="relative ">
<button class="px-2 py-0.5 group hover:text-green-700 dark:hover:text-gray-400 flex items-center
" type="button">
<svg class="mr-1.5 text-gray-400 group-hover:text-green-500" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path class="uim-tertiary" d="M19 6H5a3 3 0 0 0-3 3v2.72L8.837 14h6.326L22 11.72V9a3 3 0 0 0-3-3z" opacity=".5" fill="currentColor"></path><path class="uim-primary" d="M10 6V5h4v1h2V5a2.002 2.002 0 0 0-2-2h-4a2.002 2.002 0 0 0-2 2v1h2zm-1.163 8L2 11.72V18a3.003 3.003 0 0 0 3 3h14a3.003 3.003 0 0 0 3-3v-6.28L15.163 14H8.837z" fill="currentColor"></path></svg>
Solutions
</button>
</div></li>
<li><a class="flex items-center group px-2 py-0.5 hover:text-gray-500 dark:hover:text-gray-400" href="/pricing" data-ga-category="header-menu" data-ga-action="clicked pricing" data-ga-label="pricing">Pricing
</a></li>
<li><div class="relative group">
<button class="px-2 py-0.5 hover:text-gray-500 dark:hover:text-gray-600 flex items-center
" type="button">
<svg class="mr-1.5 text-gray-500 w-5 group-hover:text-gray-400 dark:text-gray-300 dark:group-hover:text-gray-400" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" width="1em" height="1em" viewBox="0 0 32 18" preserveAspectRatio="xMidYMid meet"><path fill-rule="evenodd" clip-rule="evenodd" d="M14.4504 3.30221C14.4504 2.836 14.8284 2.45807 15.2946 2.45807H28.4933C28.9595 2.45807 29.3374 2.836 29.3374 3.30221C29.3374 3.76842 28.9595 4.14635 28.4933 4.14635H15.2946C14.8284 4.14635 14.4504 3.76842 14.4504 3.30221Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M14.4504 9.00002C14.4504 8.53382 14.8284 8.15588 15.2946 8.15588H28.4933C28.9595 8.15588 29.3374 8.53382 29.3374 9.00002C29.3374 9.46623 28.9595 9.84417 28.4933 9.84417H15.2946C14.8284 9.84417 14.4504 9.46623 14.4504 9.00002Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M14.4504 14.6978C14.4504 14.2316 14.8284 13.8537 15.2946 13.8537H28.4933C28.9595 13.8537 29.3374 14.2316 29.3374 14.6978C29.3374 15.164 28.9595 15.542 28.4933 15.542H15.2946C14.8284 15.542 14.4504 15.164 14.4504 14.6978Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M1.94549 6.87377C2.27514 6.54411 2.80962 6.54411 3.13928 6.87377L6.23458 9.96907L9.32988 6.87377C9.65954 6.54411 10.194 6.54411 10.5237 6.87377C10.8533 7.20343 10.8533 7.73791 10.5237 8.06756L6.23458 12.3567L1.94549 8.06756C1.61583 7.73791 1.61583 7.20343 1.94549 6.87377Z" fill="currentColor"></path></svg>
</button>
</div></li>
<li><hr class="w-0.5 h-5 border-none bg-gray-100 dark:bg-gray-800"></li>
<form action="/logout" method="POST"><input type="hidden" name="csrf" value="eyJkYXRhIjp7ImV4cGlyYXRpb24iOjE2NjM1NjQzOTI5NjcsInVzZXJJZCI6IjYzMjQwMDY0OTJlMDdlM2NhMjBhODA1YSJ9LCJzaWduYXR1cmUiOiI4NTE3ODU0YThkZDQ3MzE0NzZhOWQ2NDdjNDIxZjc1MjYyMjQwMzhmNWQzMGI0MGFkNWRiOGZkMGRlZWUxZDAwIn0="></form>
<li><div class="relative ml-2 w-[1.38rem] h-[1.38rem]">
<button class="ml-auto rounded-full ring-2 group ring-indigo-400 focus:ring-blue-500 hover:ring-offset-1 focus:ring-offset-1 focus:outline-none outline-none dark:ring-offset-gray-950
" type="button">
<div class="relative"><img alt="" class="w-[1.38rem] h-[1.38rem] rounded-full overflow-hidden" src="/avatars/7428f63dfdeb64f1e1471f043a7a65a6.svg">
</div>
</button>
</div></li></ul></nav></div></header></div>
<main class="flex flex-col flex-1 "><header class="bg-gradient-to-t from-gray-50-to-white via-white dark:via-gray-950
pt-4"><div class="container relative"><h1 class="flex items-center flex-wrap text-lg leading-tight
"><a href="/spaces" class="group flex items-center mb-1"><svg class="mr-1 text-gray-400" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path d="M7.80914 18.7462V24.1907H13.2536V18.7462H7.80914Z" fill="#FF3270"></path><path d="M18.7458 18.7462V24.1907H24.1903V18.7462H18.7458Z" fill="#861FFF"></path><path d="M7.80914 7.80982V13.2543H13.2536V7.80982H7.80914Z" fill="#097EFF"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M4 6.41775C4 5.08246 5.08246 4 6.41775 4H14.6457C15.7626 4 16.7026 4.75724 16.9802 5.78629C18.1505 4.67902 19.7302 4 21.4685 4C25.0758 4 28.0003 6.92436 28.0003 10.5317C28.0003 12.27 27.3212 13.8497 26.2139 15.02C27.243 15.2977 28.0003 16.2376 28.0003 17.3545V25.5824C28.0003 26.9177 26.9177 28.0003 25.5824 28.0003H17.0635H14.9367H6.41775C5.08246 28.0003 4 26.9177 4 25.5824V15.1587V14.9367V6.41775ZM7.80952 7.80952V13.254H13.254V7.80952H7.80952ZM7.80952 24.1907V18.7462H13.254V24.1907H7.80952ZM18.7462 24.1907V18.7462H24.1907V24.1907H18.7462ZM18.7462 10.5317C18.7462 9.0283 19.9651 7.80952 21.4685 7.80952C22.9719 7.80952 24.1907 9.0283 24.1907 10.5317C24.1907 12.0352 22.9719 13.254 21.4685 13.254C19.9651 13.254 18.7462 12.0352 18.7462 10.5317Z" fill="black"></path><path d="M21.4681 7.80982C19.9647 7.80982 18.7458 9.02861 18.7458 10.5321C18.7458 12.0355 19.9647 13.2543 21.4681 13.2543C22.9715 13.2543 24.1903 12.0355 24.1903 10.5321C24.1903 9.02861 22.9715 7.80982 21.4681 7.80982Z" fill="#FFD702"></path></svg>
<span class="text-gray-400 group-hover:text-gray-500 mr-3 font-semibold">Spaces:</span></a>
<div class="flex items-center mb-1"><img alt="" class="w-4 h-4 rounded mr-1.5" src="https://aeiljuispo.cloudimg.io/v7/https://s3.amazonaws.com/moonup/production/uploads/1658934963145-624bebf604abc7ebb01789af.png?w=200&amp;h=200&amp;f=face">
<a href="/stabilityai" class="font-sans text-gray-400 hover:text-blue-600">stabilityai</a>
<div class="text-gray-300 mx-0.5">/</div></div>
<div class="max-w-full mb-1"><a class="font-mono font-semibold break-words" href="/spaces/stabilityai/stable-diffusion">stable-diffusion</a>
<div class="SVELTE_HYDRATER contents" data-props="{&quot;classNames&quot;:&quot;mr-4&quot;,&quot;title&quot;:&quot;Copy space name to clipboard&quot;,&quot;value&quot;:&quot;stabilityai/stable-diffusion&quot;}" data-target="CopyButton"><button class="inline-flex items-center relative bg-white text-sm focus:text-green-500 cursor-pointer focus:outline-none
mr-4
mx-0.5
text-gray-600
" title="Copy space name to clipboard" type="button"><svg class="" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" fill="currentColor" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path d="M28,10V28H10V10H28m0-2H10a2,2,0,0,0-2,2V28a2,2,0,0,0,2,2H28a2,2,0,0,0,2-2V10a2,2,0,0,0-2-2Z" transform="translate(0)"></path><path d="M4,18H2V4A2,2,0,0,1,4,2H18V4H4Z" transform="translate(0)"></path><rect fill="none" width="32" height="32"></rect></svg>
<div class="
absolute pointer-events-none transition-opacity bg-black text-white py-1 px-2 leading-tight rounded font-normal shadow
left-1/2 top-full transform -translate-x-1/2 translate-y-2
opacity-0
"><div class="absolute bottom-full left-1/2 transform -translate-x-1/2 w-0 h-0 border-black border-4 border-t-0" style="
border-left-color: transparent;
border-right-color: transparent;
"></div>
Copied</div></button></div></div>
<div class="SVELTE_HYDRATER contents" data-props="{&quot;isLoggedIn&quot;:true,&quot;classNames&quot;:&quot;mr-3 mb-1&quot;,&quot;isLikedByUser&quot;:false,&quot;likes&quot;:1778,&quot;repoId&quot;:&quot;stabilityai/stable-diffusion&quot;,&quot;repoType&quot;:&quot;space&quot;}" data-target="LikeButton"><div class="inline-flex items-center border leading-none whitespace-nowrap text-sm rounded-md text-gray-500 overflow-hidden bg-white
mr-3 mb-1"><button class="relative flex items-center px-1.5 py-1 hover:bg-gradient-to-t focus:outline-none from-red-50 to-transparent dark:from-red-900 dark:to-red-800 overflow-hidden" title="Like"><svg class="mr-1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32" fill="currentColor"><path d="M22.45,6a5.47,5.47,0,0,1,3.91,1.64,5.7,5.7,0,0,1,0,8L16,26.13,5.64,15.64a5.7,5.7,0,0,1,0-8,5.48,5.48,0,0,1,7.82,0L16,10.24l2.53-2.58A5.44,5.44,0,0,1,22.45,6m0-2a7.47,7.47,0,0,0-5.34,2.24L16,7.36,14.89,6.24a7.49,7.49,0,0,0-10.68,0,7.72,7.72,0,0,0,0,10.82L16,29,27.79,17.06a7.72,7.72,0,0,0,0-10.82A7.49,7.49,0,0,0,22.45,4Z"></path></svg>
<svg class="mr-1 absolute text-red-500 origin-center transform transition ease-in\n\t\t\t\ttranslate-y-10 scale-0" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32" fill="currentColor"><path d="M22.5,4c-2,0-3.9,0.8-5.3,2.2L16,7.4l-1.1-1.1C12,3.3,7.2,3.3,4.3,6.2c0,0-0.1,0.1-0.1,0.1c-3,3-3,7.8,0,10.8L16,29l11.8-11.9c3-3,3-7.8,0-10.8C26.4,4.8,24.5,4,22.5,4z"></path></svg>
like
</button>
<button class="flex items-center px-1.5 py-1 border-l text-gray-400 focus:outline-none hover:bg-gray-50 dark:hover:bg-gray-700 focus:bg-gray-100 " title="See users who liked this repository">1.78k</button></div>
</div>
<div class="SVELTE_HYDRATER contents" data-props="{&quot;initStage&quot;:&quot;running&quot;,&quot;rights&quot;:{&quot;readRepoContent&quot;:true,&quot;writeRepoContent&quot;:false,&quot;readRepoSettings&quot;:false,&quot;writeRepoSettings&quot;:false,&quot;readOrgSettings&quot;:false,&quot;writeOrgSettings&quot;:false},&quot;spaceId&quot;:&quot;stabilityai/stable-diffusion&quot;}" data-target="SpaceStatus">
<div class="border inline-flex items-center leading-none whitespace-nowrap px-1.5 py-[0.3rem] font-mono text-xs rounded-md text-gray-400 overflow-hidden bg-white mr-3 mb-1 select-none
border-green-200 bg-green-50"><div class="inline-block h-1.5 w-1.5 rounded-full ml-0.5 mr-1.5 animate-pulse bg-green-500 "></div>
<span class="text-green-500">Running</span></div></div></h1>
<div class="border-b border-gray-100"><div class="flex flex-col-reverse lg:flex-row lg:items-center lg:justify-between"><div class="flex items-center h-12 -mb-px overflow-x-auto overflow-y-hidden"><a class="tab-alternate " href="/spaces/stabilityai/stable-diffusion"><svg class="mr-1.5 text-gray-400" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path class="uim-quaternary" d="M20.23 7.24L12 12L3.77 7.24a1.98 1.98 0 0 1 .7-.71L11 2.76c.62-.35 1.38-.35 2 0l6.53 3.77c.29.173.531.418.7.71z" opacity=".25" fill="currentColor"></path><path class="uim-tertiary" d="M12 12v9.5a2.09 2.09 0 0 1-.91-.21L4.5 17.48a2.003 2.003 0 0 1-1-1.73v-7.5a2.06 2.06 0 0 1 .27-1.01L12 12z" opacity=".5" fill="currentColor"></path><path class="uim-primary" d="M20.5 8.25v7.5a2.003 2.003 0 0 1-1 1.73l-6.62 3.82c-.275.13-.576.198-.88.2V12l8.23-4.76c.175.308.268.656.27 1.01z" fill="currentColor"></path></svg>
App
</a><a class="tab-alternate active" href="/spaces/stabilityai/stable-diffusion/tree/main"><svg class="mr-1.5 text-gray-400" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path class="uim-tertiary" d="M21 19h-8a1 1 0 0 1 0-2h8a1 1 0 0 1 0 2zm0-4h-8a1 1 0 0 1 0-2h8a1 1 0 0 1 0 2zm0-8h-8a1 1 0 0 1 0-2h8a1 1 0 0 1 0 2zm0 4h-8a1 1 0 0 1 0-2h8a1 1 0 0 1 0 2z" opacity=".5" fill="currentColor"></path><path class="uim-primary" d="M9 19a1 1 0 0 1-1-1V6a1 1 0 0 1 2 0v12a1 1 0 0 1-1 1zm-6-4.333a1 1 0 0 1-.64-1.769L3.438 12l-1.078-.898a1 1 0 0 1 1.28-1.538l2 1.667a1 1 0 0 1 0 1.538l-2 1.667a.999.999 0 0 1-.64.231z" fill="currentColor"></path></svg>
<span class="xl:hidden">Files</span>
<span class="hidden xl:inline">Files and versions</span>
</a><a class="tab-alternate " href="/spaces/stabilityai/stable-diffusion/discussions"><svg class="mr-1.5 text-gray-400" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path d="M20.6081 3C21.7684 3 22.8053 3.49196 23.5284 4.38415C23.9756 4.93678 24.4428 5.82749 24.4808 7.16133C24.9674 7.01707 25.4353 6.93643 25.8725 6.93643C26.9833 6.93643 27.9865 7.37587 28.696 8.17411C29.6075 9.19872 30.0124 10.4579 29.8361 11.7177C29.7523 12.3177 29.5581 12.8555 29.2678 13.3534C29.8798 13.8646 30.3306 14.5763 30.5485 15.4322C30.719 16.1032 30.8939 17.5006 29.9808 18.9403C30.0389 19.0342 30.0934 19.1319 30.1442 19.2318C30.6932 20.3074 30.7283 21.5229 30.2439 22.6548C29.5093 24.3704 27.6841 25.7219 24.1397 27.1727C21.9347 28.0753 19.9174 28.6523 19.8994 28.6575C16.9842 29.4379 14.3477 29.8345 12.0653 29.8345C7.87017 29.8345 4.8668 28.508 3.13831 25.8921C0.356375 21.6797 0.754104 17.8269 4.35369 14.1131C6.34591 12.058 7.67023 9.02782 7.94613 8.36275C8.50224 6.39343 9.97271 4.20438 12.4172 4.20438H12.4179C12.6236 4.20438 12.8314 4.2214 13.0364 4.25468C14.107 4.42854 15.0428 5.06476 15.7115 6.02205C16.4331 5.09583 17.134 4.359 17.7682 3.94323C18.7242 3.31737 19.6794 3 20.6081 3ZM20.6081 5.95917C20.2427 5.95917 19.7963 6.1197 19.3039 6.44225C17.7754 7.44319 14.8258 12.6772 13.7458 14.7131C13.3839 15.3952 12.7655 15.6837 12.2086 15.6837C11.1036 15.6837 10.2408 14.5497 12.1076 13.1085C14.9146 10.9402 13.9299 7.39584 12.5898 7.1776C12.5311 7.16799 12.4731 7.16355 12.4172 7.16355C11.1989 7.16355 10.6615 9.33114 10.6615 9.33114C10.6615 9.33114 9.0863 13.4148 6.38031 16.206C3.67434 18.998 3.5346 21.2388 5.50675 24.2246C6.85185 26.2606 9.42666 26.8753 12.0653 26.8753C14.8021 26.8753 17.6077 26.2139 19.1799 25.793C19.2574 25.7723 28.8193 22.984 27.6081 20.6107C27.4046 20.212 27.0693 20.0522 26.6471 20.0522C24.9416 20.0522 21.8393 22.6726 20.5057 22.6726C20.2076 22.6726 19.9976 22.5416 19.9116 22.222C19.3433 20.1173 28.552 19.2325 27.7758 16.1839C27.639 15.6445 27.2677 15.4256 26.746 15.4263C24.4923 15.4263 19.4358 19.5181 18.3759 19.5181C18.2949 19.5181 18.2368 19.4937 18.2053 19.4419C17.6743 18.557 17.9653 17.9394 21.7082 15.6009C25.4511 13.2617 28.0783 11.8545 26.5841 10.1752C26.4121 9.98141 26.1684 9.8956 25.8725 9.8956C23.6001 9.89634 18.2311 14.9403 18.2311 14.9403C18.2311 14.9403 16.7821 16.496 15.9057 16.496C15.7043 16.496 15.533 16.4139 15.4169 16.2112C14.7956 15.1296 21.1879 10.1286 21.5484 8.06535C21.7928 6.66715 21.3771 5.95917 20.6081 5.95917Z" fill="#FF9D00"></path><path d="M5.50686 24.2246C3.53472 21.2387 3.67446 18.9979 6.38043 16.206C9.08641 13.4147 10.6615 9.33111 10.6615 9.33111C10.6615 9.33111 11.2499 6.95933 12.59 7.17757C13.93 7.39581 14.9139 10.9401 12.1069 13.1084C9.29997 15.276 12.6659 16.7489 13.7459 14.713C14.8258 12.6772 17.7747 7.44316 19.304 6.44221C20.8326 5.44128 21.9089 6.00204 21.5484 8.06532C21.188 10.1286 14.795 15.1295 15.4171 16.2118C16.0391 17.2934 18.2312 14.9402 18.2312 14.9402C18.2312 14.9402 25.0907 8.49588 26.5842 10.1752C28.0776 11.8545 25.4512 13.2616 21.7082 15.6008C17.9646 17.9393 17.6744 18.557 18.2054 19.4418C18.7372 20.3266 26.9998 13.1351 27.7759 16.1838C28.5513 19.2324 19.3434 20.1173 19.9117 22.2219C20.48 24.3274 26.3979 18.2382 27.6082 20.6107C28.8193 22.9839 19.2574 25.7722 19.18 25.7929C16.0914 26.62 8.24723 28.3726 5.50686 24.2246Z" fill="#FFD21E"></path></svg>
Community
<div class="h-4 min-w-[1rem] px-1 rounded bg-black text-xs text-white shadow-sm items-center justify-center leading-none flex ml-1.5">216
</div>
</a>
</div>
<div class="SVELTE_HYDRATER contents" data-props="{&quot;linkedModels&quot;:[],&quot;linkedDatasets&quot;:[]}" data-target="SpaceHeaderActions">
<div class="relative mb-1.5 mt-1.5 space-y-1 sm:flex sm:space-y-0 sm:space-x-1.5 lg:mb-0 lg:mt-0">
</div></div>
</div></div></div></header>
<div class="container relative flex flex-col md:grid md:space-y-0 w-full
md:grid-cols-12
space-y-4
md:gap-6
mb-16
"><section class="pt-8 border-gray-100 col-span-full"><header class="pb-2 flex items-center justify-between flex-wrap"><div class="flex flex-wrap items-center"><div class="SVELTE_HYDRATER contents" data-props="{&quot;path&quot;:&quot;app.py&quot;,&quot;repoName&quot;:&quot;stabilityai/stable-diffusion&quot;,&quot;repoType&quot;:&quot;space&quot;,&quot;rev&quot;:&quot;main&quot;,&quot;refs&quot;:{&quot;branches&quot;:[&quot;main&quot;],&quot;tags&quot;:[]},&quot;view&quot;:&quot;blob&quot;}" data-target="BranchSelector"><div class="relative mr-4 mb-2">
<button class="text-base
cursor-pointer w-full btn text-sm" type="button">
<svg class="mr-1.5 text-gray-700 dark:text-gray-400" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24" style="transform: rotate(360deg);"><path d="M13 14c-3.36 0-4.46 1.35-4.82 2.24C9.25 16.7 10 17.76 10 19a3 3 0 0 1-3 3a3 3 0 0 1-3-3c0-1.31.83-2.42 2-2.83V7.83A2.99 2.99 0 0 1 4 5a3 3 0 0 1 3-3a3 3 0 0 1 3 3c0 1.31-.83 2.42-2 2.83v5.29c.88-.65 2.16-1.12 4-1.12c2.67 0 3.56-1.34 3.85-2.23A3.006 3.006 0 0 1 14 7a3 3 0 0 1 3-3a3 3 0 0 1 3 3c0 1.34-.88 2.5-2.09 2.86C17.65 11.29 16.68 14 13 14m-6 4a1 1 0 0 0-1 1a1 1 0 0 0 1 1a1 1 0 0 0 1-1a1 1 0 0 0-1-1M7 4a1 1 0 0 0-1 1a1 1 0 0 0 1 1a1 1 0 0 0 1-1a1 1 0 0 0-1-1m10 2a1 1 0 0 0-1 1a1 1 0 0 0 1 1a1 1 0 0 0 1-1a1 1 0 0 0-1-1z" fill="currentColor"></path></svg>
main
<svg class="-mr-1 text-gray-500" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24" style="transform: rotate(360deg);"><path d="M7 10l5 5l5-5z" fill="currentColor"></path></svg></button>
</div></div>
<div class="flex items-center flex-wrap mb-2"><a class="hover:underline text-gray-800" href="/spaces/stabilityai/stable-diffusion/tree/main">stable-diffusion</a>
<span class="text-gray-300 mx-1">/</span>
<span class="dark:text-gray-300">app.py</span></div></div>
<div class="flex flex-row items-center mb-2">
</div></header>
<div class="border border-b-0 dark:border-gray-800 px-3 py-2 flex items-baseline rounded-t-lg bg-gradient-to-t from-gray-100-to-white"><img class="w-4 h-4 rounded-full mt-0.5 mr-2.5 self-center" alt="apolinario's picture" src="/avatars/4cbf88eebc2b7d93cb43c940a9ba96ac.svg">
<div class="mr-5 truncate flex items-center flex-none"><a class="hover:underline" href="/apolinario">apolinario
</a>
</div>
<a class="mr-4 font-mono text-sm text-gray-500 truncate hover:underline" href="/spaces/stabilityai/stable-diffusion/commit/90ca23c4e6186291d3b9bb86810bd4781321caa2">Add performance upgrades</a>
<a class="text-sm border dark:border-gray-800 px-1.5 rounded bg-gray-50 dark:bg-gray-900 hover:underline" href="/spaces/stabilityai/stable-diffusion/commit/90ca23c4e6186291d3b9bb86810bd4781321caa2">90ca23c</a>
<time class="ml-auto hidden lg:block text-gray-500 dark:text-gray-400 truncate flex-none pl-2" datetime="2022-09-15T16:31:17" title="Thu, 15 Sep 2022 16:31:17 GMT">3 days ago</time></div>
<div class="flex flex-wrap items-center justify-between px-3 py-1.5 border dark:border-gray-800 text-sm text-gray-800 dark:bg-gray-900"><div class="flex flex-wrap items-center"><a class="flex items-center hover:underline my-1 mr-4 " href="/spaces/stabilityai/stable-diffusion/raw/main/app.py"><svg class="mr-1.5" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32" style="transform: rotate(360deg);"><path d="M31 16l-7 7l-1.41-1.41L28.17 16l-5.58-5.59L24 9l7 7z" fill="currentColor"></path><path d="M1 16l7-7l1.41 1.41L3.83 16l5.58 5.59L8 23l-7-7z" fill="currentColor"></path><path d="M12.419 25.484L17.639 6l1.932.518L14.35 26z" fill="currentColor"></path></svg>
raw
</a><a class="flex items-center hover:underline my-1 mr-4 " href="/spaces/stabilityai/stable-diffusion/commits/main/app.py"><svg class="mr-1.5" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32" style="transform: rotate(360deg);"><path d="M16 4C9.383 4 4 9.383 4 16s5.383 12 12 12s12-5.383 12-12S22.617 4 16 4zm0 2c5.535 0 10 4.465 10 10s-4.465 10-10 10S6 21.535 6 16S10.465 6 16 6zm-1 2v9h7v-2h-5V8z" fill="currentColor"></path></svg>
history
</a><a class="flex items-center hover:underline my-1 mr-4 " href="/spaces/stabilityai/stable-diffusion/blame/main/app.py"><svg class="mr-1.5" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32" style="transform: rotate(360deg);"><path d="M16 2a14 14 0 1 0 14 14A14 14 0 0 0 16 2zm0 26a12 12 0 1 1 12-12a12 12 0 0 1-12 12z" fill="currentColor"></path><path d="M11.5 11a2.5 2.5 0 1 0 2.5 2.5a2.48 2.48 0 0 0-2.5-2.5z" fill="currentColor"></path><path d="M20.5 11a2.5 2.5 0 1 0 2.5 2.5a2.48 2.48 0 0 0-2.5-2.5z" fill="currentColor"></path></svg>
blame
</a><a class="flex items-center hover:underline my-1 mr-4 text-green-600 dark:text-gray-300" href="/spaces/stabilityai/stable-diffusion/edit/main/app.py"><svg class="mr-1.5" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path d="M2 26h28v2H2z" fill="currentColor"></path><path d="M25.4 9c.8-.8.8-2 0-2.8l-3.6-3.6c-.8-.8-2-.8-2.8 0l-15 15V24h6.4l15-15zm-5-5L24 7.6l-3 3L17.4 7l3-3zM6 22v-3.6l10-10l3.6 3.6l-10 10H6z" fill="currentColor"></path></svg>
contribute
</a><a class="flex items-center hover:underline my-1 mr-4 " href="/spaces/stabilityai/stable-diffusion/delete/main/app.py"><svg class="mr-1.5" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path d="M12 12h2v12h-2z" fill="currentColor"></path><path d="M18 12h2v12h-2z" fill="currentColor"></path><path d="M4 6v2h2v20a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V8h2V6zm4 22V8h16v20z" fill="currentColor"></path><path d="M12 2h8v2h-8z" fill="currentColor"></path></svg>
delete
</a>
<div class="text-gray-400 flex items-center"><svg class="text-gray-300 text-sm mr-1.5 -translate-y-px" width="1em" height="1em" viewBox="0 0 22 28" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M15.3634 10.3639C15.8486 10.8491 15.8486 11.6357 15.3634 12.1209L10.9292 16.5551C10.6058 16.8785 10.0814 16.8785 9.7579 16.5551L7.03051 13.8277C6.54532 13.3425 6.54532 12.5558 7.03051 12.0707C7.51569 11.5855 8.30234 11.5855 8.78752 12.0707L9.7579 13.041C10.0814 13.3645 10.6058 13.3645 10.9292 13.041L13.6064 10.3639C14.0916 9.8787 14.8782 9.8787 15.3634 10.3639Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M10.6666 27.12C4.93329 25.28 0 19.2267 0 12.7867V6.52001C0 5.40001 0.693334 4.41334 1.73333 4.01334L9.73333 1.01334C10.3333 0.786673 11 0.786673 11.6 1.02667L19.6 4.02667C20.1083 4.21658 20.5465 4.55701 20.8562 5.00252C21.1659 5.44803 21.3324 5.97742 21.3333 6.52001V12.7867C21.3333 19.24 16.4 25.28 10.6666 27.12Z" fill="currentColor" fill-opacity="0.22"></path><path d="M10.0845 1.94967L10.0867 1.94881C10.4587 1.8083 10.8666 1.81036 11.2286 1.95515L11.2387 1.95919L11.2489 1.963L19.2489 4.963L19.25 4.96342C19.5677 5.08211 19.8416 5.29488 20.0351 5.57333C20.2285 5.85151 20.3326 6.18203 20.3333 6.52082C20.3333 6.52113 20.3333 6.52144 20.3333 6.52176L20.3333 12.7867C20.3333 18.6535 15.8922 24.2319 10.6666 26.0652C5.44153 24.2316 1 18.6409 1 12.7867V6.52001C1 5.82357 1.42893 5.20343 2.08883 4.94803L10.0845 1.94967Z" stroke="currentColor" stroke-opacity="0.30" stroke-width="2"></path></svg>
Safe
</div></div>
<div class="dark:text-gray-300">12.5 kB</div></div>
<div class="border border-t-0 rounded-b-lg dark:bg-gray-925 dark:border-gray-800 leading-tight"><div class="py-3"><div class="SVELTE_HYDRATER contents" data-props="{&quot;lines&quot;:[&quot;&lt;span class=\\&quot;hljs-keyword\\&quot;&gt;import&lt;/span&gt; gradio &lt;span class=\\&quot;hljs-keyword\\&quot;&gt;as&lt;/span&gt; gr&quot;,&quot;&quot;,&quot;&lt;span class=\\&quot;hljs-keyword\\&quot;&gt;import&lt;/span&gt; torch&quot;,&quot;&lt;span class=\\&quot;hljs-keyword\\&quot;&gt;from&lt;/span&gt; torch &lt;span class=\\&quot;hljs-keyword\\&quot;&gt;import&lt;/span&gt; autocast&quot;,&quot;&lt;span class=\\&quot;hljs-keyword\\&quot;&gt;from&lt;/span&gt; diffusers &lt;span class=\\&quot;hljs-keyword\\&quot;&gt;import&lt;/span&gt; StableDiffusionPipeline&quot;,&quot;&lt;span class=\\&quot;hljs-keyword\\&quot;&gt;from&lt;/span&gt; datasets &lt;span class=\\&quot;hljs-keyword\\&quot;&gt;import&lt;/span&gt; load_dataset&quot;,&quot;&lt;span class=\\&quot;hljs-keyword\\&quot;&gt;from&lt;/span&gt; PIL &lt;span class=\\&quot;hljs-keyword\\&quot;&gt;import&lt;/span&gt; Image &quot;,&quot;&lt;span class=\\&quot;hljs-keyword\\&quot;&gt;import&lt;/span&gt; re&quot;,&quot;&quot;,&quot;model_id = &lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;CompVis/stable-diffusion-v1-4&amp;quot;&lt;/span&gt;&quot;,&quot;device = &lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;cuda&amp;quot;&lt;/span&gt;&quot;,&quot;&quot;,&quot;&lt;span class=\\&quot;hljs-comment\\&quot;&gt;#If you are running this code locally, you need to either do a &amp;#x27;huggingface-cli login` or paste your User Access Token from here https://huggingface.co/settings/tokens into the use_auth_token field below. &lt;/span&gt;&quot;,&quot;pipe = StableDiffusionPipeline.from_pretrained(model_id, use_auth_token=&lt;span class=\\&quot;hljs-literal\\&quot;&gt;True&lt;/span&gt;, revision=&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;fp16&amp;quot;&lt;/span&gt;, torch_dtype=torch.float16)&quot;,&quot;pipe = pipe.to(device)&quot;,&quot;torch.backends.cudnn.benchmark = &lt;span class=\\&quot;hljs-literal\\&quot;&gt;True&lt;/span&gt;&quot;,&quot;&quot;,&quot;&lt;span class=\\&quot;hljs-comment\\&quot;&gt;#When running locally, you won`t have access to this, so you can remove this part&lt;/span&gt;&quot;,&quot;word_list_dataset = load_dataset(&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;stabilityai/word-list&amp;quot;&lt;/span&gt;, data_files=&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;list.txt&amp;quot;&lt;/span&gt;, use_auth_token=&lt;span class=\\&quot;hljs-literal\\&quot;&gt;True&lt;/span&gt;)&quot;,&quot;word_list = word_list_dataset[&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;train&amp;quot;&lt;/span&gt;][&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;#x27;text&amp;#x27;&lt;/span&gt;]&quot;,&quot;&quot;,&quot;&lt;span class=\\&quot;hljs-function\\&quot;&gt;&lt;span class=\\&quot;hljs-keyword\\&quot;&gt;def&lt;/span&gt; &lt;span class=\\&quot;hljs-title\\&quot;&gt;infer&lt;/span&gt;(&lt;span class=\\&quot;hljs-params\\&quot;&gt;prompt, samples, steps, scale, seed&lt;/span&gt;):&lt;/span&gt;&quot;,&quot; &lt;span class=\\&quot;hljs-comment\\&quot;&gt;#When running locally you can also remove this filter&lt;/span&gt;&quot;,&quot; &lt;span class=\\&quot;hljs-keyword\\&quot;&gt;for&lt;/span&gt; &lt;span class=\\&quot;hljs-built_in\\&quot;&gt;filter&lt;/span&gt; &lt;span class=\\&quot;hljs-keyword\\&quot;&gt;in&lt;/span&gt; word_list:&quot;,&quot; &lt;span class=\\&quot;hljs-keyword\\&quot;&gt;if&lt;/span&gt; re.search(&lt;span class=\\&quot;hljs-string\\&quot;&gt;rf&amp;quot;\\\\b&lt;span class=\\&quot;hljs-subst\\&quot;&gt;{&lt;span class=\\&quot;hljs-built_in\\&quot;&gt;filter&lt;/span&gt;}&lt;/span&gt;\\\\b&amp;quot;&lt;/span&gt;, prompt):&quot;,&quot; &lt;span class=\\&quot;hljs-keyword\\&quot;&gt;raise&lt;/span&gt; gr.Error(&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;Unsafe content found. Please try again with different prompts.&amp;quot;&lt;/span&gt;)&quot;,&quot; &quot;,&quot; generator = torch.Generator(device=device).manual_seed(seed)&quot;,&quot; &quot;,&quot; images_list = pipe(&quot;,&quot; [prompt] * samples,&quot;,&quot; num_inference_steps=steps,&quot;,&quot; guidance_scale=scale,&quot;,&quot; generator=generator,&quot;,&quot; )&quot;,&quot; images = []&quot;,&quot; safe_image = Image.&lt;span class=\\&quot;hljs-built_in\\&quot;&gt;open&lt;/span&gt;(&lt;span class=\\&quot;hljs-string\\&quot;&gt;r&amp;quot;unsafe.png&amp;quot;&lt;/span&gt;)&quot;,&quot; &lt;span class=\\&quot;hljs-keyword\\&quot;&gt;for&lt;/span&gt; i, image &lt;span class=\\&quot;hljs-keyword\\&quot;&gt;in&lt;/span&gt; &lt;span class=\\&quot;hljs-built_in\\&quot;&gt;enumerate&lt;/span&gt;(images_list[&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;sample&amp;quot;&lt;/span&gt;]):&quot;,&quot; &lt;span class=\\&quot;hljs-keyword\\&quot;&gt;if&lt;/span&gt;(images_list[&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;nsfw_content_detected&amp;quot;&lt;/span&gt;][i]):&quot;,&quot; images.append(safe_image)&quot;,&quot; &lt;span class=\\&quot;hljs-keyword\\&quot;&gt;else&lt;/span&gt;:&quot;,&quot; images.append(image)&quot;,&quot; &lt;span class=\\&quot;hljs-keyword\\&quot;&gt;return&lt;/span&gt; images&quot;,&quot; &quot;,&quot;css = &lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;&amp;quot;&amp;quot;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; .gradio-container {&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; font-family: &amp;#x27;IBM Plex Sans&amp;#x27;, sans-serif;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; }&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; .gr-button {&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; color: white;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; border-color: black;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; background: black;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; }&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; input[type=&amp;#x27;range&amp;#x27;] {&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; accent-color: black;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; }&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; .dark input[type=&amp;#x27;range&amp;#x27;] {&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; accent-color: #dfdfdf;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; }&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; .container {&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; max-width: 730px;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; margin: auto;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; padding-top: 1.5rem;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; }&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; #gallery {&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; min-height: 22rem;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; margin-bottom: 15px;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; margin-left: auto;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; margin-right: auto;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; border-bottom-right-radius: .5rem !important;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; border-bottom-left-radius: .5rem !important;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; }&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; #gallery&amp;gt;div&amp;gt;.h-full {&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; min-height: 20rem;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; }&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; .details:hover {&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; text-decoration: underline;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; }&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; .gr-button {&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; white-space: nowrap;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; }&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; .gr-button:focus {&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; border-color: rgb(147 197 253 / var(--tw-border-opacity));&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; outline: none;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; --tw-border-opacity: 1;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px var(--tw-ring-offset-width)) var(--tw-ring-color);&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; --tw-ring-color: rgb(191 219 254 / var(--tw-ring-opacity));&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; --tw-ring-opacity: .5;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; }&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; #advanced-btn {&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; font-size: .7rem !important;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; line-height: 19px;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; margin-top: 12px;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; margin-bottom: 12px;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; padding: 2px 8px;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; border-radius: 14px !important;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; }&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; #advanced-options {&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; display: none;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; margin-bottom: 20px;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; }&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; .footer {&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; margin-bottom: 45px;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; margin-top: 35px;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; text-align: center;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; border-bottom: 1px solid #e5e5e5;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; }&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; .footer&amp;gt;p {&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; font-size: .8rem;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; display: inline-block;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; padding: 0 10px;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; transform: translateY(10px);&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; background: white;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; }&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; .dark .footer {&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; border-color: #303030;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; }&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; .dark .footer&amp;gt;p {&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; background: #0b0f19;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; }&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; .acknowledgments h4{&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; margin: 1.25em 0 .25em 0;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; font-weight: bold;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; font-size: 115%;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; }&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;&amp;quot;&amp;quot;&lt;/span&gt;&quot;,&quot;&quot;,&quot;block = gr.Blocks(css=css)&quot;,&quot;&quot;,&quot;examples = [&quot;,&quot; [&quot;,&quot; &lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;#x27;A high tech solarpunk utopia in the Amazon rainforest&amp;#x27;&lt;/span&gt;,&quot;,&quot; &lt;span class=\\&quot;hljs-number\\&quot;&gt;4&lt;/span&gt;,&quot;,&quot; &lt;span class=\\&quot;hljs-number\\&quot;&gt;45&lt;/span&gt;,&quot;,&quot; &lt;span class=\\&quot;hljs-number\\&quot;&gt;7.5&lt;/span&gt;,&quot;,&quot; &lt;span class=\\&quot;hljs-number\\&quot;&gt;1024&lt;/span&gt;,&quot;,&quot; ],&quot;,&quot; [&quot;,&quot; &lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;#x27;A pikachu fine dining with a view to the Eiffel Tower&amp;#x27;&lt;/span&gt;,&quot;,&quot; &lt;span class=\\&quot;hljs-number\\&quot;&gt;4&lt;/span&gt;,&quot;,&quot; &lt;span class=\\&quot;hljs-number\\&quot;&gt;45&lt;/span&gt;,&quot;,&quot; &lt;span class=\\&quot;hljs-number\\&quot;&gt;7&lt;/span&gt;,&quot;,&quot; &lt;span class=\\&quot;hljs-number\\&quot;&gt;1024&lt;/span&gt;,&quot;,&quot; ],&quot;,&quot; [&quot;,&quot; &lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;#x27;A mecha robot in a favela in expressionist style&amp;#x27;&lt;/span&gt;,&quot;,&quot; &lt;span class=\\&quot;hljs-number\\&quot;&gt;4&lt;/span&gt;,&quot;,&quot; &lt;span class=\\&quot;hljs-number\\&quot;&gt;45&lt;/span&gt;,&quot;,&quot; &lt;span class=\\&quot;hljs-number\\&quot;&gt;7&lt;/span&gt;,&quot;,&quot; &lt;span class=\\&quot;hljs-number\\&quot;&gt;1024&lt;/span&gt;,&quot;,&quot; ],&quot;,&quot; [&quot;,&quot; &lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;#x27;an insect robot preparing a delicious meal&amp;#x27;&lt;/span&gt;,&quot;,&quot; &lt;span class=\\&quot;hljs-number\\&quot;&gt;4&lt;/span&gt;,&quot;,&quot; &lt;span class=\\&quot;hljs-number\\&quot;&gt;45&lt;/span&gt;,&quot;,&quot; &lt;span class=\\&quot;hljs-number\\&quot;&gt;7&lt;/span&gt;,&quot;,&quot; &lt;span class=\\&quot;hljs-number\\&quot;&gt;1024&lt;/span&gt;,&quot;,&quot; ],&quot;,&quot; [&quot;,&quot; &lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;A small cabin on top of a snowy mountain in the style of Disney, artstation&amp;quot;&lt;/span&gt;,&quot;,&quot; &lt;span class=\\&quot;hljs-number\\&quot;&gt;4&lt;/span&gt;,&quot;,&quot; &lt;span class=\\&quot;hljs-number\\&quot;&gt;45&lt;/span&gt;,&quot;,&quot; &lt;span class=\\&quot;hljs-number\\&quot;&gt;7&lt;/span&gt;,&quot;,&quot; &lt;span class=\\&quot;hljs-number\\&quot;&gt;1024&lt;/span&gt;,&quot;,&quot; ],&quot;,&quot;]&quot;,&quot;&quot;,&quot;&lt;span class=\\&quot;hljs-keyword\\&quot;&gt;with&lt;/span&gt; block:&quot;,&quot; gr.HTML(&quot;,&quot; &lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;&amp;quot;&amp;quot;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;div style=&amp;quot;text-align: center; max-width: 650px; margin: 0 auto;&amp;quot;&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;div&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; style=&amp;quot;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; display: inline-flex;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; align-items: center;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; gap: 0.8rem;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; font-size: 1.75rem;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;quot;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;svg&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; width=&amp;quot;0.65em&amp;quot;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; height=&amp;quot;0.65em&amp;quot;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; viewBox=&amp;quot;0 0 115 115&amp;quot;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; fill=&amp;quot;none&amp;quot;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; xmlns=&amp;quot;http://www.w3.org/2000/svg&amp;quot;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;white&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect y=&amp;quot;69&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;white&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;23&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;#AEAEAE&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;23&amp;quot; y=&amp;quot;69&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;#AEAEAE&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;46&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;white&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;46&amp;quot; y=&amp;quot;69&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;white&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;69&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;black&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;69&amp;quot; y=&amp;quot;69&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;black&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;92&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;#D9D9D9&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;92&amp;quot; y=&amp;quot;69&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;#AEAEAE&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;115&amp;quot; y=&amp;quot;46&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;white&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;115&amp;quot; y=&amp;quot;115&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;white&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;115&amp;quot; y=&amp;quot;69&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;#D9D9D9&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;92&amp;quot; y=&amp;quot;46&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;#AEAEAE&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;92&amp;quot; y=&amp;quot;115&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;#AEAEAE&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;92&amp;quot; y=&amp;quot;69&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;white&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;69&amp;quot; y=&amp;quot;46&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;white&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;69&amp;quot; y=&amp;quot;115&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;white&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;69&amp;quot; y=&amp;quot;69&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;#D9D9D9&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;46&amp;quot; y=&amp;quot;46&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;black&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;46&amp;quot; y=&amp;quot;115&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;black&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;46&amp;quot; y=&amp;quot;69&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;black&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;23&amp;quot; y=&amp;quot;46&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;#D9D9D9&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;23&amp;quot; y=&amp;quot;115&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;#AEAEAE&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;rect x=&amp;quot;23&amp;quot; y=&amp;quot;69&amp;quot; width=&amp;quot;23&amp;quot; height=&amp;quot;23&amp;quot; fill=&amp;quot;black&amp;quot;&amp;gt;&amp;lt;/rect&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;/svg&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;h1 style=&amp;quot;font-weight: 900; margin-bottom: 7px;&amp;quot;&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; Stable Diffusion Demo&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;/h1&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;/div&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;p style=&amp;quot;margin-bottom: 10px; font-size: 94%&amp;quot;&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; Stable Diffusion is a state of the art text-to-image model that generates&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; images from text.&amp;lt;br&amp;gt;For faster generation and forthcoming API&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; access you can try&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;a&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; href=&amp;quot;http://beta.dreamstudio.ai/&amp;quot;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; style=&amp;quot;text-decoration: underline;&amp;quot;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; target=&amp;quot;_blank&amp;quot;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;gt;DreamStudio Beta&amp;lt;/a&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;/p&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;/div&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;quot;&amp;quot;&amp;quot;&lt;/span&gt;&quot;,&quot; )&quot;,&quot; &lt;span class=\\&quot;hljs-keyword\\&quot;&gt;with&lt;/span&gt; gr.Group():&quot;,&quot; &lt;span class=\\&quot;hljs-keyword\\&quot;&gt;with&lt;/span&gt; gr.Box():&quot;,&quot; &lt;span class=\\&quot;hljs-keyword\\&quot;&gt;with&lt;/span&gt; gr.Row().style(mobile_collapse=&lt;span class=\\&quot;hljs-literal\\&quot;&gt;False&lt;/span&gt;, equal_height=&lt;span class=\\&quot;hljs-literal\\&quot;&gt;True&lt;/span&gt;):&quot;,&quot; text = gr.Textbox(&quot;,&quot; label=&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;Enter your prompt&amp;quot;&lt;/span&gt;,&quot;,&quot; show_label=&lt;span class=\\&quot;hljs-literal\\&quot;&gt;False&lt;/span&gt;,&quot;,&quot; max_lines=&lt;span class=\\&quot;hljs-number\\&quot;&gt;1&lt;/span&gt;,&quot;,&quot; placeholder=&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;Enter your prompt&amp;quot;&lt;/span&gt;,&quot;,&quot; ).style(&quot;,&quot; border=(&lt;span class=\\&quot;hljs-literal\\&quot;&gt;True&lt;/span&gt;, &lt;span class=\\&quot;hljs-literal\\&quot;&gt;False&lt;/span&gt;, &lt;span class=\\&quot;hljs-literal\\&quot;&gt;True&lt;/span&gt;, &lt;span class=\\&quot;hljs-literal\\&quot;&gt;True&lt;/span&gt;),&quot;,&quot; rounded=(&lt;span class=\\&quot;hljs-literal\\&quot;&gt;True&lt;/span&gt;, &lt;span class=\\&quot;hljs-literal\\&quot;&gt;False&lt;/span&gt;, &lt;span class=\\&quot;hljs-literal\\&quot;&gt;False&lt;/span&gt;, &lt;span class=\\&quot;hljs-literal\\&quot;&gt;True&lt;/span&gt;),&quot;,&quot; container=&lt;span class=\\&quot;hljs-literal\\&quot;&gt;False&lt;/span&gt;,&quot;,&quot; )&quot;,&quot; btn = gr.Button(&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;Generate image&amp;quot;&lt;/span&gt;).style(&quot;,&quot; margin=&lt;span class=\\&quot;hljs-literal\\&quot;&gt;False&lt;/span&gt;,&quot;,&quot; rounded=(&lt;span class=\\&quot;hljs-literal\\&quot;&gt;False&lt;/span&gt;, &lt;span class=\\&quot;hljs-literal\\&quot;&gt;True&lt;/span&gt;, &lt;span class=\\&quot;hljs-literal\\&quot;&gt;True&lt;/span&gt;, &lt;span class=\\&quot;hljs-literal\\&quot;&gt;False&lt;/span&gt;),&quot;,&quot; )&quot;,&quot;&quot;,&quot; gallery = gr.Gallery(&quot;,&quot; label=&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;Generated images&amp;quot;&lt;/span&gt;, show_label=&lt;span class=\\&quot;hljs-literal\\&quot;&gt;False&lt;/span&gt;, elem_id=&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;gallery&amp;quot;&lt;/span&gt;&quot;,&quot; ).style(grid=[&lt;span class=\\&quot;hljs-number\\&quot;&gt;2&lt;/span&gt;], height=&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;auto&amp;quot;&lt;/span&gt;)&quot;,&quot;&quot;,&quot; advanced_button = gr.Button(&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;Advanced options&amp;quot;&lt;/span&gt;, elem_id=&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;advanced-btn&amp;quot;&lt;/span&gt;)&quot;,&quot;&quot;,&quot; &lt;span class=\\&quot;hljs-keyword\\&quot;&gt;with&lt;/span&gt; gr.Row(elem_id=&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;advanced-options&amp;quot;&lt;/span&gt;):&quot;,&quot; samples = gr.Slider(label=&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;Images&amp;quot;&lt;/span&gt;, minimum=&lt;span class=\\&quot;hljs-number\\&quot;&gt;1&lt;/span&gt;, maximum=&lt;span class=\\&quot;hljs-number\\&quot;&gt;4&lt;/span&gt;, value=&lt;span class=\\&quot;hljs-number\\&quot;&gt;4&lt;/span&gt;, step=&lt;span class=\\&quot;hljs-number\\&quot;&gt;1&lt;/span&gt;)&quot;,&quot; steps = gr.Slider(label=&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;Steps&amp;quot;&lt;/span&gt;, minimum=&lt;span class=\\&quot;hljs-number\\&quot;&gt;1&lt;/span&gt;, maximum=&lt;span class=\\&quot;hljs-number\\&quot;&gt;50&lt;/span&gt;, value=&lt;span class=\\&quot;hljs-number\\&quot;&gt;45&lt;/span&gt;, step=&lt;span class=\\&quot;hljs-number\\&quot;&gt;1&lt;/span&gt;)&quot;,&quot; scale = gr.Slider(&quot;,&quot; label=&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;Guidance Scale&amp;quot;&lt;/span&gt;, minimum=&lt;span class=\\&quot;hljs-number\\&quot;&gt;0&lt;/span&gt;, maximum=&lt;span class=\\&quot;hljs-number\\&quot;&gt;50&lt;/span&gt;, value=&lt;span class=\\&quot;hljs-number\\&quot;&gt;7.5&lt;/span&gt;, step=&lt;span class=\\&quot;hljs-number\\&quot;&gt;0.1&lt;/span&gt;&quot;,&quot; )&quot;,&quot; seed = gr.Slider(&quot;,&quot; label=&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;Seed&amp;quot;&lt;/span&gt;,&quot;,&quot; minimum=&lt;span class=\\&quot;hljs-number\\&quot;&gt;0&lt;/span&gt;,&quot;,&quot; maximum=&lt;span class=\\&quot;hljs-number\\&quot;&gt;2147483647&lt;/span&gt;,&quot;,&quot; step=&lt;span class=\\&quot;hljs-number\\&quot;&gt;1&lt;/span&gt;,&quot;,&quot; randomize=&lt;span class=\\&quot;hljs-literal\\&quot;&gt;True&lt;/span&gt;,&quot;,&quot; )&quot;,&quot;&quot;,&quot; ex = gr.Examples(examples=examples, fn=infer, inputs=[text, samples, steps, scale, seed], outputs=gallery, cache_examples=&lt;span class=\\&quot;hljs-literal\\&quot;&gt;True&lt;/span&gt;)&quot;,&quot; ex.dataset.headers = [&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;&amp;quot;&lt;/span&gt;]&quot;,&quot;&quot;,&quot; &quot;,&quot; text.submit(infer, inputs=[text, samples, steps, scale, seed], outputs=gallery)&quot;,&quot; btn.click(infer, inputs=[text, samples, steps, scale, seed], outputs=gallery)&quot;,&quot; advanced_button.click(&quot;,&quot; &lt;span class=\\&quot;hljs-literal\\&quot;&gt;None&lt;/span&gt;,&quot;,&quot; [],&quot;,&quot; text,&quot;,&quot; _js=&lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;&amp;quot;&amp;quot;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; () =&amp;gt; {&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; const options = document.querySelector(&amp;quot;body &amp;gt; gradio-app&amp;quot;).querySelector(&amp;quot;#advanced-options&amp;quot;);&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; options.style.display = [&amp;quot;none&amp;quot;, &amp;quot;&amp;quot;].includes(options.style.display) ? &amp;quot;flex&amp;quot; : &amp;quot;none&amp;quot;;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; }&amp;quot;&amp;quot;&amp;quot;&lt;/span&gt;,&quot;,&quot; )&quot;,&quot; gr.HTML(&quot;,&quot; &lt;span class=\\&quot;hljs-string\\&quot;&gt;&amp;quot;&amp;quot;&amp;quot;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;div class=&amp;quot;footer&amp;quot;&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;p&amp;gt;Model by &amp;lt;a href=&amp;quot;https://huggingface.co/CompVis&amp;quot; style=&amp;quot;text-decoration: underline;&amp;quot; target=&amp;quot;_blank&amp;quot;&amp;gt;CompVis&amp;lt;/a&amp;gt; and &amp;lt;a href=&amp;quot;https://huggingface.co/stabilityai&amp;quot; style=&amp;quot;text-decoration: underline;&amp;quot; target=&amp;quot;_blank&amp;quot;&amp;gt;Stability AI&amp;lt;/a&amp;gt; - Gradio Demo by 🤗 Hugging Face&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;/p&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;/div&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;div class=&amp;quot;acknowledgments&amp;quot;&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;p&amp;gt;&amp;lt;h4&amp;gt;LICENSE&amp;lt;/h4&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt;The model is licensed with a &amp;lt;a href=&amp;quot;https://huggingface.co/spaces/CompVis/stable-diffusion-license&amp;quot; style=&amp;quot;text-decoration: underline;&amp;quot; target=&amp;quot;_blank&amp;quot;&amp;gt;CreativeML Open RAIL-M&amp;lt;/a&amp;gt; license. The authors claim no rights on the outputs you generate, you are free to use them and are accountable for their use which must not go against the provisions set in this license. The license 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, spread misinformation and target vulnerable groups. For the full list of restrictions please &amp;lt;a href=&amp;quot;https://huggingface.co/spaces/CompVis/stable-diffusion-license&amp;quot; target=&amp;quot;_blank&amp;quot; style=&amp;quot;text-decoration: underline;&amp;quot; target=&amp;quot;_blank&amp;quot;&amp;gt;read the license&amp;lt;/a&amp;gt;&amp;lt;/p&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;p&amp;gt;&amp;lt;h4&amp;gt;Biases and content acknowledgment&amp;lt;/h4&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt;Despite how impressive being able to turn text into image is, beware to the fact that this model may output content that reinforces or exacerbates societal biases, as well as realistic faces, pornography and violence. The model was trained on the &amp;lt;a href=&amp;quot;https://laion.ai/blog/laion-5b/&amp;quot; style=&amp;quot;text-decoration: underline;&amp;quot; target=&amp;quot;_blank&amp;quot;&amp;gt;LAION-5B dataset&amp;lt;/a&amp;gt;, which scraped non-curated image-text-pairs from the internet (the exception being the removal of illegal content) and is meant for research purposes. You can read more in the &amp;lt;a href=&amp;quot;https://huggingface.co/CompVis/stable-diffusion-v1-4&amp;quot; style=&amp;quot;text-decoration: underline;&amp;quot; target=&amp;quot;_blank&amp;quot;&amp;gt;model card&amp;lt;/a&amp;gt;&amp;lt;/p&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;lt;/div&amp;gt;&lt;/span&gt;&quot;,&quot;&lt;span class=\\&quot;hljs-string\\&quot;&gt; &amp;quot;&amp;quot;&amp;quot;&lt;/span&gt;&quot;,&quot; )&quot;,&quot;&quot;,&quot;block.queue(max_size=&lt;span class=\\&quot;hljs-number\\&quot;&gt;25&lt;/span&gt;).launch()&quot;]}" data-target="BlobContent">
<div class="relative text-sm"><div class="overflow-x-auto"><table class="border-collapse font-mono"><tbody><tr class="" id="L1">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="1"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-keyword">import</span> gradio <span class="hljs-keyword">as</span> gr</td>
</tr><tr class="" id="L2">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="2"></td>
<td class="px-3 overflow-visible whitespace-pre">
</td>
</tr><tr class="" id="L3">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="3"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-keyword">import</span> torch</td>
</tr><tr class="" id="L4">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="4"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-keyword">from</span> torch <span class="hljs-keyword">import</span> autocast</td>
</tr><tr class="" id="L5">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="5"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-keyword">from</span> diffusers <span class="hljs-keyword">import</span> StableDiffusionPipeline</td>
</tr><tr class="" id="L6">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="6"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-keyword">from</span> datasets <span class="hljs-keyword">import</span> load_dataset</td>
</tr><tr class="" id="L7">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="7"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-keyword">from</span> PIL <span class="hljs-keyword">import</span> Image </td>
</tr><tr class="" id="L8">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="8"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-keyword">import</span> re</td>
</tr><tr class="" id="L9">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="9"></td>
<td class="px-3 overflow-visible whitespace-pre">
</td>
</tr><tr class="" id="L10">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="10"></td>
<td class="px-3 overflow-visible whitespace-pre">model_id = <span class="hljs-string">&quot;CompVis/stable-diffusion-v1-4&quot;</span></td>
</tr><tr class="" id="L11">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="11"></td>
<td class="px-3 overflow-visible whitespace-pre">device = <span class="hljs-string">&quot;cuda&quot;</span></td>
</tr><tr class="" id="L12">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="12"></td>
<td class="px-3 overflow-visible whitespace-pre">
</td>
</tr><tr class="" id="L13">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="13"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-comment">#If you are running this code locally, you need to either do a &#x27;huggingface-cli login` or paste your User Access Token from here https://huggingface.co/settings/tokens into the use_auth_token field below. </span></td>
</tr><tr class="" id="L14">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="14"></td>
<td class="px-3 overflow-visible whitespace-pre">pipe = StableDiffusionPipeline.from_pretrained(model_id, use_auth_token=<span class="hljs-literal">True</span>, revision=<span class="hljs-string">&quot;fp16&quot;</span>, torch_dtype=torch.float16)</td>
</tr><tr class="" id="L15">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="15"></td>
<td class="px-3 overflow-visible whitespace-pre">pipe = pipe.to(device)</td>
</tr><tr class="" id="L16">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="16"></td>
<td class="px-3 overflow-visible whitespace-pre">torch.backends.cudnn.benchmark = <span class="hljs-literal">True</span></td>
</tr><tr class="" id="L17">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="17"></td>
<td class="px-3 overflow-visible whitespace-pre">
</td>
</tr><tr class="" id="L18">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="18"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-comment">#When running locally, you won`t have access to this, so you can remove this part</span></td>
</tr><tr class="" id="L19">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="19"></td>
<td class="px-3 overflow-visible whitespace-pre">word_list_dataset = load_dataset(<span class="hljs-string">&quot;stabilityai/word-list&quot;</span>, data_files=<span class="hljs-string">&quot;list.txt&quot;</span>, use_auth_token=<span class="hljs-literal">True</span>)</td>
</tr><tr class="" id="L20">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="20"></td>
<td class="px-3 overflow-visible whitespace-pre">word_list = word_list_dataset[<span class="hljs-string">&quot;train&quot;</span>][<span class="hljs-string">&#x27;text&#x27;</span>]</td>
</tr><tr class="" id="L21">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="21"></td>
<td class="px-3 overflow-visible whitespace-pre">
</td>
</tr><tr class="" id="L22">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="22"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-function"><span class="hljs-keyword">def</span> <span class="hljs-title">infer</span>(<span class="hljs-params">prompt, samples, steps, scale, seed</span>):</span></td>
</tr><tr class="" id="L23">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="23"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-comment">#When running locally you can also remove this filter</span></td>
</tr><tr class="" id="L24">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="24"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-keyword">for</span> <span class="hljs-built_in">filter</span> <span class="hljs-keyword">in</span> word_list:</td>
</tr><tr class="" id="L25">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="25"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-keyword">if</span> re.search(<span class="hljs-string">rf&quot;\b<span class="hljs-subst">{<span class="hljs-built_in">filter</span>}</span>\b&quot;</span>, prompt):</td>
</tr><tr class="" id="L26">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="26"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-keyword">raise</span> gr.Error(<span class="hljs-string">&quot;Unsafe content found. Please try again with different prompts.&quot;</span>)</td>
</tr><tr class="" id="L27">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="27"></td>
<td class="px-3 overflow-visible whitespace-pre"> </td>
</tr><tr class="" id="L28">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="28"></td>
<td class="px-3 overflow-visible whitespace-pre"> generator = torch.Generator(device=device).manual_seed(seed)</td>
</tr><tr class="" id="L29">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="29"></td>
<td class="px-3 overflow-visible whitespace-pre"> </td>
</tr><tr class="" id="L30">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="30"></td>
<td class="px-3 overflow-visible whitespace-pre"> images_list = pipe(</td>
</tr><tr class="" id="L31">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="31"></td>
<td class="px-3 overflow-visible whitespace-pre"> [prompt] * samples,</td>
</tr><tr class="" id="L32">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="32"></td>
<td class="px-3 overflow-visible whitespace-pre"> num_inference_steps=steps,</td>
</tr><tr class="" id="L33">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="33"></td>
<td class="px-3 overflow-visible whitespace-pre"> guidance_scale=scale,</td>
</tr><tr class="" id="L34">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="34"></td>
<td class="px-3 overflow-visible whitespace-pre"> generator=generator,</td>
</tr><tr class="" id="L35">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="35"></td>
<td class="px-3 overflow-visible whitespace-pre"> )</td>
</tr><tr class="" id="L36">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="36"></td>
<td class="px-3 overflow-visible whitespace-pre"> images = []</td>
</tr><tr class="" id="L37">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="37"></td>
<td class="px-3 overflow-visible whitespace-pre"> safe_image = Image.<span class="hljs-built_in">open</span>(<span class="hljs-string">r&quot;unsafe.png&quot;</span>)</td>
</tr><tr class="" id="L38">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="38"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-keyword">for</span> i, image <span class="hljs-keyword">in</span> <span class="hljs-built_in">enumerate</span>(images_list[<span class="hljs-string">&quot;sample&quot;</span>]):</td>
</tr><tr class="" id="L39">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="39"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-keyword">if</span>(images_list[<span class="hljs-string">&quot;nsfw_content_detected&quot;</span>][i]):</td>
</tr><tr class="" id="L40">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="40"></td>
<td class="px-3 overflow-visible whitespace-pre"> images.append(safe_image)</td>
</tr><tr class="" id="L41">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="41"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-keyword">else</span>:</td>
</tr><tr class="" id="L42">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="42"></td>
<td class="px-3 overflow-visible whitespace-pre"> images.append(image)</td>
</tr><tr class="" id="L43">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="43"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-keyword">return</span> images</td>
</tr><tr class="" id="L44">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="44"></td>
<td class="px-3 overflow-visible whitespace-pre"> </td>
</tr><tr class="" id="L45">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="45"></td>
<td class="px-3 overflow-visible whitespace-pre">css = <span class="hljs-string">&quot;&quot;&quot;</span></td>
</tr><tr class="" id="L46">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="46"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> .gradio-container {</span></td>
</tr><tr class="" id="L47">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="47"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> font-family: &#x27;IBM Plex Sans&#x27;, sans-serif;</span></td>
</tr><tr class="" id="L48">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="48"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> }</span></td>
</tr><tr class="" id="L49">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="49"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> .gr-button {</span></td>
</tr><tr class="" id="L50">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="50"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> color: white;</span></td>
</tr><tr class="" id="L51">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="51"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> border-color: black;</span></td>
</tr><tr class="" id="L52">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="52"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> background: black;</span></td>
</tr><tr class="" id="L53">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="53"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> }</span></td>
</tr><tr class="" id="L54">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="54"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> input[type=&#x27;range&#x27;] {</span></td>
</tr><tr class="" id="L55">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="55"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> accent-color: black;</span></td>
</tr><tr class="" id="L56">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="56"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> }</span></td>
</tr><tr class="" id="L57">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="57"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> .dark input[type=&#x27;range&#x27;] {</span></td>
</tr><tr class="" id="L58">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="58"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> accent-color: #dfdfdf;</span></td>
</tr><tr class="" id="L59">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="59"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> }</span></td>
</tr><tr class="" id="L60">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="60"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> .container {</span></td>
</tr><tr class="" id="L61">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="61"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> max-width: 730px;</span></td>
</tr><tr class="" id="L62">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="62"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> margin: auto;</span></td>
</tr><tr class="" id="L63">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="63"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> padding-top: 1.5rem;</span></td>
</tr><tr class="" id="L64">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="64"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> }</span></td>
</tr><tr class="" id="L65">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="65"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> #gallery {</span></td>
</tr><tr class="" id="L66">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="66"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> min-height: 22rem;</span></td>
</tr><tr class="" id="L67">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="67"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> margin-bottom: 15px;</span></td>
</tr><tr class="" id="L68">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="68"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> margin-left: auto;</span></td>
</tr><tr class="" id="L69">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="69"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> margin-right: auto;</span></td>
</tr><tr class="" id="L70">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="70"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> border-bottom-right-radius: .5rem !important;</span></td>
</tr><tr class="" id="L71">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="71"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> border-bottom-left-radius: .5rem !important;</span></td>
</tr><tr class="" id="L72">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="72"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> }</span></td>
</tr><tr class="" id="L73">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="73"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> #gallery&gt;div&gt;.h-full {</span></td>
</tr><tr class="" id="L74">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="74"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> min-height: 20rem;</span></td>
</tr><tr class="" id="L75">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="75"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> }</span></td>
</tr><tr class="" id="L76">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="76"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> .details:hover {</span></td>
</tr><tr class="" id="L77">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="77"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> text-decoration: underline;</span></td>
</tr><tr class="" id="L78">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="78"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> }</span></td>
</tr><tr class="" id="L79">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="79"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> .gr-button {</span></td>
</tr><tr class="" id="L80">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="80"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> white-space: nowrap;</span></td>
</tr><tr class="" id="L81">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="81"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> }</span></td>
</tr><tr class="" id="L82">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="82"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> .gr-button:focus {</span></td>
</tr><tr class="" id="L83">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="83"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> border-color: rgb(147 197 253 / var(--tw-border-opacity));</span></td>
</tr><tr class="" id="L84">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="84"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> outline: none;</span></td>
</tr><tr class="" id="L85">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="85"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);</span></td>
</tr><tr class="" id="L86">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="86"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> --tw-border-opacity: 1;</span></td>
</tr><tr class="" id="L87">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="87"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);</span></td>
</tr><tr class="" id="L88">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="88"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px var(--tw-ring-offset-width)) var(--tw-ring-color);</span></td>
</tr><tr class="" id="L89">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="89"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> --tw-ring-color: rgb(191 219 254 / var(--tw-ring-opacity));</span></td>
</tr><tr class="" id="L90">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="90"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> --tw-ring-opacity: .5;</span></td>
</tr><tr class="" id="L91">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="91"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> }</span></td>
</tr><tr class="" id="L92">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="92"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> #advanced-btn {</span></td>
</tr><tr class="" id="L93">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="93"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> font-size: .7rem !important;</span></td>
</tr><tr class="" id="L94">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="94"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> line-height: 19px;</span></td>
</tr><tr class="" id="L95">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="95"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> margin-top: 12px;</span></td>
</tr><tr class="" id="L96">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="96"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> margin-bottom: 12px;</span></td>
</tr><tr class="" id="L97">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="97"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> padding: 2px 8px;</span></td>
</tr><tr class="" id="L98">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="98"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> border-radius: 14px !important;</span></td>
</tr><tr class="" id="L99">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="99"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> }</span></td>
</tr><tr class="" id="L100">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="100"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> #advanced-options {</span></td>
</tr><tr class="" id="L101">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="101"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> display: none;</span></td>
</tr><tr class="" id="L102">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="102"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> margin-bottom: 20px;</span></td>
</tr><tr class="" id="L103">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="103"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> }</span></td>
</tr><tr class="" id="L104">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="104"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> .footer {</span></td>
</tr><tr class="" id="L105">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="105"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> margin-bottom: 45px;</span></td>
</tr><tr class="" id="L106">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="106"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> margin-top: 35px;</span></td>
</tr><tr class="" id="L107">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="107"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> text-align: center;</span></td>
</tr><tr class="" id="L108">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="108"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> border-bottom: 1px solid #e5e5e5;</span></td>
</tr><tr class="" id="L109">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="109"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> }</span></td>
</tr><tr class="" id="L110">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="110"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> .footer&gt;p {</span></td>
</tr><tr class="" id="L111">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="111"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> font-size: .8rem;</span></td>
</tr><tr class="" id="L112">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="112"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> display: inline-block;</span></td>
</tr><tr class="" id="L113">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="113"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> padding: 0 10px;</span></td>
</tr><tr class="" id="L114">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="114"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> transform: translateY(10px);</span></td>
</tr><tr class="" id="L115">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="115"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> background: white;</span></td>
</tr><tr class="" id="L116">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="116"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> }</span></td>
</tr><tr class="" id="L117">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="117"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> .dark .footer {</span></td>
</tr><tr class="" id="L118">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="118"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> border-color: #303030;</span></td>
</tr><tr class="" id="L119">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="119"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> }</span></td>
</tr><tr class="" id="L120">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="120"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> .dark .footer&gt;p {</span></td>
</tr><tr class="" id="L121">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="121"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> background: #0b0f19;</span></td>
</tr><tr class="" id="L122">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="122"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> }</span></td>
</tr><tr class="" id="L123">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="123"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> .acknowledgments h4{</span></td>
</tr><tr class="" id="L124">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="124"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> margin: 1.25em 0 .25em 0;</span></td>
</tr><tr class="" id="L125">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="125"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> font-weight: bold;</span></td>
</tr><tr class="" id="L126">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="126"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> font-size: 115%;</span></td>
</tr><tr class="" id="L127">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="127"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> }</span></td>
</tr><tr class="" id="L128">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="128"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string">&quot;&quot;&quot;</span></td>
</tr><tr class="" id="L129">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="129"></td>
<td class="px-3 overflow-visible whitespace-pre">
</td>
</tr><tr class="" id="L130">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="130"></td>
<td class="px-3 overflow-visible whitespace-pre">block = gr.Blocks(css=css)</td>
</tr><tr class="" id="L131">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="131"></td>
<td class="px-3 overflow-visible whitespace-pre">
</td>
</tr><tr class="" id="L132">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="132"></td>
<td class="px-3 overflow-visible whitespace-pre">examples = [</td>
</tr><tr class="" id="L133">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="133"></td>
<td class="px-3 overflow-visible whitespace-pre"> [</td>
</tr><tr class="" id="L134">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="134"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-string">&#x27;A high tech solarpunk utopia in the Amazon rainforest&#x27;</span>,</td>
</tr><tr class="" id="L135">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="135"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-number">4</span>,</td>
</tr><tr class="" id="L136">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="136"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-number">45</span>,</td>
</tr><tr class="" id="L137">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="137"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-number">7.5</span>,</td>
</tr><tr class="" id="L138">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="138"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-number">1024</span>,</td>
</tr><tr class="" id="L139">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="139"></td>
<td class="px-3 overflow-visible whitespace-pre"> ],</td>
</tr><tr class="" id="L140">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="140"></td>
<td class="px-3 overflow-visible whitespace-pre"> [</td>
</tr><tr class="" id="L141">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="141"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-string">&#x27;A pikachu fine dining with a view to the Eiffel Tower&#x27;</span>,</td>
</tr><tr class="" id="L142">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="142"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-number">4</span>,</td>
</tr><tr class="" id="L143">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="143"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-number">45</span>,</td>
</tr><tr class="" id="L144">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="144"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-number">7</span>,</td>
</tr><tr class="" id="L145">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="145"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-number">1024</span>,</td>
</tr><tr class="" id="L146">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="146"></td>
<td class="px-3 overflow-visible whitespace-pre"> ],</td>
</tr><tr class="" id="L147">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="147"></td>
<td class="px-3 overflow-visible whitespace-pre"> [</td>
</tr><tr class="" id="L148">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="148"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-string">&#x27;A mecha robot in a favela in expressionist style&#x27;</span>,</td>
</tr><tr class="" id="L149">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="149"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-number">4</span>,</td>
</tr><tr class="" id="L150">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="150"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-number">45</span>,</td>
</tr><tr class="" id="L151">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="151"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-number">7</span>,</td>
</tr><tr class="" id="L152">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="152"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-number">1024</span>,</td>
</tr><tr class="" id="L153">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="153"></td>
<td class="px-3 overflow-visible whitespace-pre"> ],</td>
</tr><tr class="" id="L154">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="154"></td>
<td class="px-3 overflow-visible whitespace-pre"> [</td>
</tr><tr class="" id="L155">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="155"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-string">&#x27;an insect robot preparing a delicious meal&#x27;</span>,</td>
</tr><tr class="" id="L156">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="156"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-number">4</span>,</td>
</tr><tr class="" id="L157">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="157"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-number">45</span>,</td>
</tr><tr class="" id="L158">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="158"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-number">7</span>,</td>
</tr><tr class="" id="L159">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="159"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-number">1024</span>,</td>
</tr><tr class="" id="L160">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="160"></td>
<td class="px-3 overflow-visible whitespace-pre"> ],</td>
</tr><tr class="" id="L161">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="161"></td>
<td class="px-3 overflow-visible whitespace-pre"> [</td>
</tr><tr class="" id="L162">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="162"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-string">&quot;A small cabin on top of a snowy mountain in the style of Disney, artstation&quot;</span>,</td>
</tr><tr class="" id="L163">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="163"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-number">4</span>,</td>
</tr><tr class="" id="L164">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="164"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-number">45</span>,</td>
</tr><tr class="" id="L165">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="165"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-number">7</span>,</td>
</tr><tr class="" id="L166">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="166"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-number">1024</span>,</td>
</tr><tr class="" id="L167">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="167"></td>
<td class="px-3 overflow-visible whitespace-pre"> ],</td>
</tr><tr class="" id="L168">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="168"></td>
<td class="px-3 overflow-visible whitespace-pre">]</td>
</tr><tr class="" id="L169">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="169"></td>
<td class="px-3 overflow-visible whitespace-pre">
</td>
</tr><tr class="" id="L170">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="170"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-keyword">with</span> block:</td>
</tr><tr class="" id="L171">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="171"></td>
<td class="px-3 overflow-visible whitespace-pre"> gr.HTML(</td>
</tr><tr class="" id="L172">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="172"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-string">&quot;&quot;&quot;</span></td>
</tr><tr class="" id="L173">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="173"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;div style=&quot;text-align: center; max-width: 650px; margin: 0 auto;&quot;&gt;</span></td>
</tr><tr class="" id="L174">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="174"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;div</span></td>
</tr><tr class="" id="L175">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="175"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> style=&quot;</span></td>
</tr><tr class="" id="L176">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="176"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> display: inline-flex;</span></td>
</tr><tr class="" id="L177">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="177"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> align-items: center;</span></td>
</tr><tr class="" id="L178">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="178"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> gap: 0.8rem;</span></td>
</tr><tr class="" id="L179">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="179"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> font-size: 1.75rem;</span></td>
</tr><tr class="" id="L180">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="180"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &quot;</span></td>
</tr><tr class="" id="L181">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="181"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &gt;</span></td>
</tr><tr class="" id="L182">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="182"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;svg</span></td>
</tr><tr class="" id="L183">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="183"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> width=&quot;0.65em&quot;</span></td>
</tr><tr class="" id="L184">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="184"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> height=&quot;0.65em&quot;</span></td>
</tr><tr class="" id="L185">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="185"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> viewBox=&quot;0 0 115 115&quot;</span></td>
</tr><tr class="" id="L186">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="186"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> fill=&quot;none&quot;</span></td>
</tr><tr class="" id="L187">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="187"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> xmlns=&quot;http://www.w3.org/2000/svg&quot;</span></td>
</tr><tr class="" id="L188">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="188"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &gt;</span></td>
</tr><tr class="" id="L189">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="189"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect width=&quot;23&quot; height=&quot;23&quot; fill=&quot;white&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L190">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="190"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect y=&quot;69&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;white&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L191">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="191"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;23&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;#AEAEAE&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L192">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="192"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;23&quot; y=&quot;69&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;#AEAEAE&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L193">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="193"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;46&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;white&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L194">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="194"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;46&quot; y=&quot;69&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;white&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L195">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="195"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;69&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;black&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L196">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="196"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;69&quot; y=&quot;69&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;black&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L197">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="197"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;92&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;#D9D9D9&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L198">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="198"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;92&quot; y=&quot;69&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;#AEAEAE&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L199">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="199"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;115&quot; y=&quot;46&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;white&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L200">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="200"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;115&quot; y=&quot;115&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;white&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L201">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="201"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;115&quot; y=&quot;69&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;#D9D9D9&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L202">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="202"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;92&quot; y=&quot;46&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;#AEAEAE&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L203">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="203"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;92&quot; y=&quot;115&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;#AEAEAE&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L204">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="204"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;92&quot; y=&quot;69&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;white&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L205">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="205"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;69&quot; y=&quot;46&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;white&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L206">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="206"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;69&quot; y=&quot;115&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;white&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L207">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="207"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;69&quot; y=&quot;69&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;#D9D9D9&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L208">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="208"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;46&quot; y=&quot;46&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;black&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L209">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="209"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;46&quot; y=&quot;115&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;black&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L210">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="210"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;46&quot; y=&quot;69&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;black&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L211">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="211"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;23&quot; y=&quot;46&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;#D9D9D9&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L212">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="212"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;23&quot; y=&quot;115&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;#AEAEAE&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L213">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="213"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;rect x=&quot;23&quot; y=&quot;69&quot; width=&quot;23&quot; height=&quot;23&quot; fill=&quot;black&quot;&gt;&lt;/rect&gt;</span></td>
</tr><tr class="" id="L214">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="214"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;/svg&gt;</span></td>
</tr><tr class="" id="L215">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="215"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;h1 style=&quot;font-weight: 900; margin-bottom: 7px;&quot;&gt;</span></td>
</tr><tr class="" id="L216">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="216"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> Stable Diffusion Demo</span></td>
</tr><tr class="" id="L217">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="217"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;/h1&gt;</span></td>
</tr><tr class="" id="L218">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="218"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;/div&gt;</span></td>
</tr><tr class="" id="L219">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="219"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;p style=&quot;margin-bottom: 10px; font-size: 94%&quot;&gt;</span></td>
</tr><tr class="" id="L220">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="220"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> Stable Diffusion is a state of the art text-to-image model that generates</span></td>
</tr><tr class="" id="L221">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="221"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> images from text.&lt;br&gt;For faster generation and forthcoming API</span></td>
</tr><tr class="" id="L222">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="222"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> access you can try</span></td>
</tr><tr class="" id="L223">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="223"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;a</span></td>
</tr><tr class="" id="L224">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="224"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> href=&quot;http://beta.dreamstudio.ai/&quot;</span></td>
</tr><tr class="" id="L225">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="225"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> style=&quot;text-decoration: underline;&quot;</span></td>
</tr><tr class="" id="L226">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="226"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> target=&quot;_blank&quot;</span></td>
</tr><tr class="" id="L227">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="227"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &gt;DreamStudio Beta&lt;/a</span></td>
</tr><tr class="" id="L228">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="228"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &gt;</span></td>
</tr><tr class="" id="L229">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="229"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;/p&gt;</span></td>
</tr><tr class="" id="L230">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="230"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;/div&gt;</span></td>
</tr><tr class="" id="L231">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="231"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &quot;&quot;&quot;</span></td>
</tr><tr class="" id="L232">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="232"></td>
<td class="px-3 overflow-visible whitespace-pre"> )</td>
</tr><tr class="" id="L233">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="233"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-keyword">with</span> gr.Group():</td>
</tr><tr class="" id="L234">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="234"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-keyword">with</span> gr.Box():</td>
</tr><tr class="" id="L235">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="235"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-keyword">with</span> gr.Row().style(mobile_collapse=<span class="hljs-literal">False</span>, equal_height=<span class="hljs-literal">True</span>):</td>
</tr><tr class="" id="L236">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="236"></td>
<td class="px-3 overflow-visible whitespace-pre"> text = gr.Textbox(</td>
</tr><tr class="" id="L237">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="237"></td>
<td class="px-3 overflow-visible whitespace-pre"> label=<span class="hljs-string">&quot;Enter your prompt&quot;</span>,</td>
</tr><tr class="" id="L238">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="238"></td>
<td class="px-3 overflow-visible whitespace-pre"> show_label=<span class="hljs-literal">False</span>,</td>
</tr><tr class="" id="L239">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="239"></td>
<td class="px-3 overflow-visible whitespace-pre"> max_lines=<span class="hljs-number">1</span>,</td>
</tr><tr class="" id="L240">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="240"></td>
<td class="px-3 overflow-visible whitespace-pre"> placeholder=<span class="hljs-string">&quot;Enter your prompt&quot;</span>,</td>
</tr><tr class="" id="L241">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="241"></td>
<td class="px-3 overflow-visible whitespace-pre"> ).style(</td>
</tr><tr class="" id="L242">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="242"></td>
<td class="px-3 overflow-visible whitespace-pre"> border=(<span class="hljs-literal">True</span>, <span class="hljs-literal">False</span>, <span class="hljs-literal">True</span>, <span class="hljs-literal">True</span>),</td>
</tr><tr class="" id="L243">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="243"></td>
<td class="px-3 overflow-visible whitespace-pre"> rounded=(<span class="hljs-literal">True</span>, <span class="hljs-literal">False</span>, <span class="hljs-literal">False</span>, <span class="hljs-literal">True</span>),</td>
</tr><tr class="" id="L244">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="244"></td>
<td class="px-3 overflow-visible whitespace-pre"> container=<span class="hljs-literal">False</span>,</td>
</tr><tr class="" id="L245">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="245"></td>
<td class="px-3 overflow-visible whitespace-pre"> )</td>
</tr><tr class="" id="L246">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="246"></td>
<td class="px-3 overflow-visible whitespace-pre"> btn = gr.Button(<span class="hljs-string">&quot;Generate image&quot;</span>).style(</td>
</tr><tr class="" id="L247">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="247"></td>
<td class="px-3 overflow-visible whitespace-pre"> margin=<span class="hljs-literal">False</span>,</td>
</tr><tr class="" id="L248">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="248"></td>
<td class="px-3 overflow-visible whitespace-pre"> rounded=(<span class="hljs-literal">False</span>, <span class="hljs-literal">True</span>, <span class="hljs-literal">True</span>, <span class="hljs-literal">False</span>),</td>
</tr><tr class="" id="L249">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="249"></td>
<td class="px-3 overflow-visible whitespace-pre"> )</td>
</tr><tr class="" id="L250">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="250"></td>
<td class="px-3 overflow-visible whitespace-pre">
</td>
</tr><tr class="" id="L251">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="251"></td>
<td class="px-3 overflow-visible whitespace-pre"> gallery = gr.Gallery(</td>
</tr><tr class="" id="L252">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="252"></td>
<td class="px-3 overflow-visible whitespace-pre"> label=<span class="hljs-string">&quot;Generated images&quot;</span>, show_label=<span class="hljs-literal">False</span>, elem_id=<span class="hljs-string">&quot;gallery&quot;</span></td>
</tr><tr class="" id="L253">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="253"></td>
<td class="px-3 overflow-visible whitespace-pre"> ).style(grid=[<span class="hljs-number">2</span>], height=<span class="hljs-string">&quot;auto&quot;</span>)</td>
</tr><tr class="" id="L254">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="254"></td>
<td class="px-3 overflow-visible whitespace-pre">
</td>
</tr><tr class="" id="L255">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="255"></td>
<td class="px-3 overflow-visible whitespace-pre"> advanced_button = gr.Button(<span class="hljs-string">&quot;Advanced options&quot;</span>, elem_id=<span class="hljs-string">&quot;advanced-btn&quot;</span>)</td>
</tr><tr class="" id="L256">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="256"></td>
<td class="px-3 overflow-visible whitespace-pre">
</td>
</tr><tr class="" id="L257">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="257"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-keyword">with</span> gr.Row(elem_id=<span class="hljs-string">&quot;advanced-options&quot;</span>):</td>
</tr><tr class="" id="L258">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="258"></td>
<td class="px-3 overflow-visible whitespace-pre"> samples = gr.Slider(label=<span class="hljs-string">&quot;Images&quot;</span>, minimum=<span class="hljs-number">1</span>, maximum=<span class="hljs-number">4</span>, value=<span class="hljs-number">4</span>, step=<span class="hljs-number">1</span>)</td>
</tr><tr class="" id="L259">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="259"></td>
<td class="px-3 overflow-visible whitespace-pre"> steps = gr.Slider(label=<span class="hljs-string">&quot;Steps&quot;</span>, minimum=<span class="hljs-number">1</span>, maximum=<span class="hljs-number">50</span>, value=<span class="hljs-number">45</span>, step=<span class="hljs-number">1</span>)</td>
</tr><tr class="" id="L260">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="260"></td>
<td class="px-3 overflow-visible whitespace-pre"> scale = gr.Slider(</td>
</tr><tr class="" id="L261">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="261"></td>
<td class="px-3 overflow-visible whitespace-pre"> label=<span class="hljs-string">&quot;Guidance Scale&quot;</span>, minimum=<span class="hljs-number">0</span>, maximum=<span class="hljs-number">50</span>, value=<span class="hljs-number">7.5</span>, step=<span class="hljs-number">0.1</span></td>
</tr><tr class="" id="L262">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="262"></td>
<td class="px-3 overflow-visible whitespace-pre"> )</td>
</tr><tr class="" id="L263">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="263"></td>
<td class="px-3 overflow-visible whitespace-pre"> seed = gr.Slider(</td>
</tr><tr class="" id="L264">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="264"></td>
<td class="px-3 overflow-visible whitespace-pre"> label=<span class="hljs-string">&quot;Seed&quot;</span>,</td>
</tr><tr class="" id="L265">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="265"></td>
<td class="px-3 overflow-visible whitespace-pre"> minimum=<span class="hljs-number">0</span>,</td>
</tr><tr class="" id="L266">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="266"></td>
<td class="px-3 overflow-visible whitespace-pre"> maximum=<span class="hljs-number">2147483647</span>,</td>
</tr><tr class="" id="L267">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="267"></td>
<td class="px-3 overflow-visible whitespace-pre"> step=<span class="hljs-number">1</span>,</td>
</tr><tr class="" id="L268">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="268"></td>
<td class="px-3 overflow-visible whitespace-pre"> randomize=<span class="hljs-literal">True</span>,</td>
</tr><tr class="" id="L269">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="269"></td>
<td class="px-3 overflow-visible whitespace-pre"> )</td>
</tr><tr class="" id="L270">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="270"></td>
<td class="px-3 overflow-visible whitespace-pre">
</td>
</tr><tr class="" id="L271">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="271"></td>
<td class="px-3 overflow-visible whitespace-pre"> ex = gr.Examples(examples=examples, fn=infer, inputs=[text, samples, steps, scale, seed], outputs=gallery, cache_examples=<span class="hljs-literal">True</span>)</td>
</tr><tr class="" id="L272">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="272"></td>
<td class="px-3 overflow-visible whitespace-pre"> ex.dataset.headers = [<span class="hljs-string">&quot;&quot;</span>]</td>
</tr><tr class="" id="L273">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="273"></td>
<td class="px-3 overflow-visible whitespace-pre">
</td>
</tr><tr class="" id="L274">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="274"></td>
<td class="px-3 overflow-visible whitespace-pre"> </td>
</tr><tr class="" id="L275">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="275"></td>
<td class="px-3 overflow-visible whitespace-pre"> text.submit(infer, inputs=[text, samples, steps, scale, seed], outputs=gallery)</td>
</tr><tr class="" id="L276">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="276"></td>
<td class="px-3 overflow-visible whitespace-pre"> btn.click(infer, inputs=[text, samples, steps, scale, seed], outputs=gallery)</td>
</tr><tr class="" id="L277">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="277"></td>
<td class="px-3 overflow-visible whitespace-pre"> advanced_button.click(</td>
</tr><tr class="" id="L278">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="278"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-literal">None</span>,</td>
</tr><tr class="" id="L279">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="279"></td>
<td class="px-3 overflow-visible whitespace-pre"> [],</td>
</tr><tr class="" id="L280">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="280"></td>
<td class="px-3 overflow-visible whitespace-pre"> text,</td>
</tr><tr class="" id="L281">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="281"></td>
<td class="px-3 overflow-visible whitespace-pre"> _js=<span class="hljs-string">&quot;&quot;&quot;</span></td>
</tr><tr class="" id="L282">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="282"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> () =&gt; {</span></td>
</tr><tr class="" id="L283">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="283"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> const options = document.querySelector(&quot;body &gt; gradio-app&quot;).querySelector(&quot;#advanced-options&quot;);</span></td>
</tr><tr class="" id="L284">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="284"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> options.style.display = [&quot;none&quot;, &quot;&quot;].includes(options.style.display) ? &quot;flex&quot; : &quot;none&quot;;</span></td>
</tr><tr class="" id="L285">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="285"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> }&quot;&quot;&quot;</span>,</td>
</tr><tr class="" id="L286">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="286"></td>
<td class="px-3 overflow-visible whitespace-pre"> )</td>
</tr><tr class="" id="L287">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="287"></td>
<td class="px-3 overflow-visible whitespace-pre"> gr.HTML(</td>
</tr><tr class="" id="L288">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="288"></td>
<td class="px-3 overflow-visible whitespace-pre"> <span class="hljs-string">&quot;&quot;&quot;</span></td>
</tr><tr class="" id="L289">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="289"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;div class=&quot;footer&quot;&gt;</span></td>
</tr><tr class="" id="L290">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="290"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;p&gt;Model by &lt;a href=&quot;https://huggingface.co/CompVis&quot; style=&quot;text-decoration: underline;&quot; target=&quot;_blank&quot;&gt;CompVis&lt;/a&gt; and &lt;a href=&quot;https://huggingface.co/stabilityai&quot; style=&quot;text-decoration: underline;&quot; target=&quot;_blank&quot;&gt;Stability AI&lt;/a&gt; - Gradio Demo by 🤗 Hugging Face</span></td>
</tr><tr class="" id="L291">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="291"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;/p&gt;</span></td>
</tr><tr class="" id="L292">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="292"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;/div&gt;</span></td>
</tr><tr class="" id="L293">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="293"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;div class=&quot;acknowledgments&quot;&gt;</span></td>
</tr><tr class="" id="L294">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="294"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;p&gt;&lt;h4&gt;LICENSE&lt;/h4&gt;</span></td>
</tr><tr class="" id="L295">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="295"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string">The model is licensed with a &lt;a href=&quot;https://huggingface.co/spaces/CompVis/stable-diffusion-license&quot; style=&quot;text-decoration: underline;&quot; target=&quot;_blank&quot;&gt;CreativeML Open RAIL-M&lt;/a&gt; license. The authors claim no rights on the outputs you generate, you are free to use them and are accountable for their use which must not go against the provisions set in this license. The license 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, spread misinformation and target vulnerable groups. For the full list of restrictions please &lt;a href=&quot;https://huggingface.co/spaces/CompVis/stable-diffusion-license&quot; target=&quot;_blank&quot; style=&quot;text-decoration: underline;&quot; target=&quot;_blank&quot;&gt;read the license&lt;/a&gt;&lt;/p&gt;</span></td>
</tr><tr class="" id="L296">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="296"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;p&gt;&lt;h4&gt;Biases and content acknowledgment&lt;/h4&gt;</span></td>
</tr><tr class="" id="L297">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="297"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string">Despite how impressive being able to turn text into image is, beware to the fact that this model may output content that reinforces or exacerbates societal biases, as well as realistic faces, pornography and violence. The model was trained on the &lt;a href=&quot;https://laion.ai/blog/laion-5b/&quot; style=&quot;text-decoration: underline;&quot; target=&quot;_blank&quot;&gt;LAION-5B dataset&lt;/a&gt;, which scraped non-curated image-text-pairs from the internet (the exception being the removal of illegal content) and is meant for research purposes. You can read more in the &lt;a href=&quot;https://huggingface.co/CompVis/stable-diffusion-v1-4&quot; style=&quot;text-decoration: underline;&quot; target=&quot;_blank&quot;&gt;model card&lt;/a&gt;&lt;/p&gt;</span></td>
</tr><tr class="" id="L298">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="298"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &lt;/div&gt;</span></td>
</tr><tr class="" id="L299">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="299"></td>
<td class="px-3 overflow-visible whitespace-pre"><span class="hljs-string"> &quot;&quot;&quot;</span></td>
</tr><tr class="" id="L300">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="300"></td>
<td class="px-3 overflow-visible whitespace-pre"> )</td>
</tr><tr class="" id="L301">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="301"></td>
<td class="px-3 overflow-visible whitespace-pre">
</td>
</tr><tr class="" id="L302">
<td class="text-right select-none pl-5 pr-3 cursor-pointer text-gray-300 hover:text-black blob-line-num" line-num="302"></td>
<td class="px-3 overflow-visible whitespace-pre">block.queue(max_size=<span class="hljs-number">25</span>).launch()</td>
</tr></tbody></table></div>
</div></div></div></div></section></div></main>
</div>
<script>
import("/front/build/index.7520c4e01.js");
window.moonSha = ".7520c4e01";
</script>
<script type="text/javascript">
/// LinkedIn (part 1)
_linkedin_partner_id = "3734489";
window._linkedin_data_partner_ids =
window._linkedin_data_partner_ids || [];
window._linkedin_data_partner_ids.push(_linkedin_partner_id);
</script>
<script>
if (
!(
["localhost", "huggingface.test"].includes(
window.location.hostname
) || window.location.hostname.includes("ngrok.io")
)
) {
(function (i, s, o, g, r, a, m) {
i["GoogleAnalyticsObject"] = r;
(i[r] =
i[r] ||
function () {
(i[r].q = i[r].q || []).push(arguments);
}),
(i[r].l = 1 * new Date());
(a = s.createElement(o)), (m = s.getElementsByTagName(o)[0]);
a.async = 1;
a.src = g;
m.parentNode.insertBefore(a, m);
})(
window,
document,
"script",
"https://www.google-analytics.com/analytics.js",
"ganalytics"
);
ganalytics("create", "UA-83738774-2", "auto");
ganalytics("send", "pageview");
/// LinkedIn (part 2)
(function (l) {
if (!l) {
window.lintrk = function (a, b) {
window.lintrk.q.push([a, b]);
};
window.lintrk.q = [];
}
var s = document.getElementsByTagName("script")[0];
var b = document.createElement("script");
b.type = "text/javascript";
b.async = true;
b.src = "https://snap.licdn.com/li.lms-analytics/insight.min.js";
s.parentNode.insertBefore(b, s);
})(window.lintrk);
}
</script>
<noscript>
<!-- LinkedIn (part 3) -->
<img
height="1"
width="1"
style="display: none"
alt=""
src="https://px.ads.linkedin.com/collect/?pid=3734489&fmt=gif"
/>
</noscript>
</body>
</html>