File size: 20,666 Bytes
ecf0e74
 
cabd7e6
9e44986
1c32c81
cabd7e6
 
 
 
 
 
 
 
 
 
395a975
cabd7e6
204e009
cabd7e6
 
 
 
 
 
 
 
395a975
cabd7e6
 
 
 
395a975
cabd7e6
 
 
 
395a975
 
 
 
 
 
 
 
cabd7e6
 
 
 
395a975
cabd7e6
 
 
5fc2029
cabd7e6
 
 
 
 
 
 
9e44986
7572315
9e44986
f561d4d
5fc2029
f561d4d
cabd7e6
214046a
cabd7e6
 
89f2ef2
f561d4d
89f2ef2
cabd7e6
 
204e009
cabd7e6
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
35e8599
cabd7e6
 
 
 
 
 
 
 
 
 
ecf0e74
42b75a8
 
 
 
 
 
 
 
 
 
395a975
42b75a8
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
bb43957
 
 
5fc2029
 
42b75a8
bb43957
 
 
 
 
 
 
 
 
 
42b75a8
bb43957
 
 
 
395a975
bb43957
 
 
 
395a975
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
5fc2029
395a975
 
bb43957
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
5fc2029
f561d4d
5fc2029
f561d4d
bb43957
 
5fc2029
 
 
 
 
 
 
 
 
 
 
 
bb43957
42b75a8
 
 
 
 
 
395a975
bb43957
5fc2029
42b75a8
bb43957
 
 
 
42b75a8
bb43957
42b75a8
 
 
bb43957
42b75a8
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
bb43957
 
 
42b75a8
bb43957
42b75a8
 
 
bb43957
 
 
 
 
 
 
 
 
 
 
 
 
 
 
42b75a8
bb43957
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
5fc2029
bb43957
 
 
 
 
 
 
 
395a975
 
bb43957
 
395a975
 
 
 
bb43957
 
395a975
 
 
 
bb43957
 
 
5fc2029
bb43957
 
 
5fc2029
 
 
 
 
 
 
 
bb43957
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
cabd7e6
bb43957
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
<!DOCTYPE html>
<html>
<head>
	<title>SDXL Artist Style Explorer by Mattthew</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<script type="text/javascript" src="artists_and_tags.js"></script>
	<script type="text/javascript" src="index.js"></script>
	<link rel="stylesheet" href="index.css">
	<link rel="preconnect" href="https://fonts.googleapis.com">
	<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
	<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap" rel="stylesheet">
</head>
<body>
	<div id="layout">
		<div id="rows">
			<div id="toggles" class="start">
				<div id="options_info">
					<span class="count">press the <i>/</i> key</span>
				</div>
				<div id="options_prompts">
					<span class="count">show me:</span>
					<span class="link selected" id="promptA">🎨</span>
					<span class="link" id="promptP">🧑</span>
					<span class="link" id="promptL">🏞️</span>
				</div>
				<div id="options_artist_sort">
					<span class="count">sort artists:</span>
					<span class="link selected" id="sortAR">🎰</span>
					<span class="link" id="sortAA">🔠</span>
				</div>
				<div id="options_tag_sort">
					<span class="count">sort tags:</span>
					<span class="link selected" id="sortTC">📶</span>
					<span class="link" id="sortTA">🔠</span>
				</div>
				<div class="divider"></div>
				<div id="second_model">
					<span>B:</span><div>
						<select onautocomplete="off">
							<option value="SDXL">2nd model: SDXL 1.0</option>
						</select>
					</div>
				</div>
				<div class="divider"></div>
				<label class="top_control top_all">
					<input type="checkbox" checked="checked" name="check-all" value="check-all" autocomplete="off"><span>all artists</span><span class="count"></span>
				</label>
				<div id="artistsShown" class="top_control">
					<span class="count">shown - %</span>
				</div>
				<div class="divider"></div>
				<label class="top_control">
					<input type="checkbox" checked="checked" name="mode" value="mode" autocomplete="off"><span>permissive filter</span><span class="count"></span>
				</label>
				<label class="top_control">
					<input type="checkbox" checked="checked" name="use_categories" value="use_categories" autocomplete="off"><span>use categories</span><span class="count"></span>
				</label>
				<label class="top_control">
					<input type="checkbox" checked="checked" name="low_count" value="low_count" autocomplete="off"><span>hide low-use tags</span><span class="count"></span>
				</label>
				<label class="top_control">
					<input type="checkbox" checked="checked" name="deprecated" value="deprecated" autocomplete="off"><span>hide unknown to SDXL</span><span class="count"></span>
				</label>
				<label class="top_control">
					<input type="checkbox" checked="checked" name="nudity" value="nudity" autocomplete="off"><span>don't blur risqué</span><span class="count"></span>
				</label>
				<div class="divider"></div>
				<span id="edit_most_used" class="hidden">edit these</span>
				<!-- JS will insert checkboxes here -->
			</div>
			<div id="gutter">
				<div data-tooltip="← →"></div>
			</div>
			<div id="image-container">
				<div id="filtersHidingAll">
					no tags are check-marked<br>
					👀
				</div>
				<!-- JS will insert images here -->
				<!--
				<div class="image-item tag1 tag2">
					<span>
						<h3>
							<span class="firstN">Name</span>
							<span class="lastN">Name</span>
						</h3>
						<h4>
							tag1, tag2
						</h4>
					</span>
					<div>
						<div class="imgTools">
							<div class="art_prev"></div>
							<div class="art_star"></div>
							<div class="art_next"></div>
							<div class="art_edit"></div>
						</div>
						<div class="imgBox">
							<img alt="First Last - art" src="images/SDXL_1_0/First_Last-artwork.jpg">
							<img alt="First Last - art" src="images/SDXL_1_0/First_Last-potrait.jpg">
							<img alt="First Last - art" src="images/SDXL_1_0/First_Last-landscape.jpg">
						</div>
					</div>
				</div>
				-->
			</div>
		</div>
		<div id="prompt_builder">
			<div id="prompt_artist_search"></div>
			<div id="prompt_selector">
				<div>
					<div id="prompt_builder_title">build-a-prompt:</div>
					<div class="prompt_artist">
						<div class="prompt_artist_count">
							<div>1</div>
						</div>
						<div class="prompt_artist_name">
							<input type="text" value="" placeholder="search by name" autocomplete="off" required pattern=".+" title="you can also tap an artist name to add them here" />
						</div>
						<div class="prompt_artist_intensity" title="the weight of this artist">
							<select autocomplete="off">
								<option value="1">✖ 1</option>
								<option value="2">✖ 2</option>
								<option value="3">✖ 3</option>
							</select>
						</div>
						<div class="prompt_artist_combine" title="the method of combining, type / for more info">
							<select autocomplete="off">
								<option value="add">add</option>
								<option value="loop">loop</option>
								<option value="swap">swap</option>
							</select>
						</div>
						<div class="prompt_artist_left" title="move an artist left to give them more weight">
							<div><</div>
						</div>
						<div class="prompt_artist_right" title="move an artist right to give them less weight">
							<div>></div>
						</div>
						<div class="prompt_artist_remove" title="remove this artist from the prompt">
							<span>X</span>
						</div>
					</div>
					<div id="prompt_artist_add">
						<div>
							<span>add another</span>
						</div>
					</div>
				</div>
				<div id="prompt_builder_hide"></div>
			</div>
			<div id="prompt_result">
				<div>
					<span>
						<b>(</b>artwork in the style of <i>[</i>name<i>|</i>name<i>]</i><b>:1.5)</b>,
					</span>
					<span>
						<b>(</b>an image<b>:0.5)</b>,
					</span>
					<span>
						<b>(</b><span id="prompt_result_editable" contenteditable="true"></span><b>:1.0)</b>
					</span>
				</div>
				<div id="prompt_result_copy">copy this prompt</div>
			</div>
		</div>
	</div>
	<div id="information">
		<div id="info_switcher">
			<h2 id="info_actions" class="selected">🔍&nbsp;&nbsp;&nbsp;search</h2>
			<h2 id="info_help">📓&nbsp;&nbsp;&nbsp;features</h2>
			<h2 id="info_tips">📸&nbsp;&nbsp;&nbsp;prompts</h2>
			<h2 id="info_about">💫&nbsp;&nbsp;&nbsp;about</h2>
			<h2 id="info_export">📤&nbsp;&nbsp;&nbsp;export</h2>
			<h2 id="info_closer">ESC</h2>
		</div>
		<div id="information_actions" class="information_section selected">
			<div class="buttons">
				<div id="info-toggle-all">toggle all tags</div>
				<div id="random-tags">see some random tags</div>
				<div id="copy-all-names">copy visible artist names</div>
			</div>
			<input type="text" id="info_search_input" name="info_search_input" value="" placeholder="search for tags" autocomplete="off">
			<div id="info_search_output"></div>
		</div>
		<div id="information_help" class="information_section">
			<div>
				<h3>Tap an artist's...</h3>
				<ul>
					<li><strong>name</strong> to copy them to clipboard</li>
					<li><strong>tags</strong> to copy them to clipboard</li>
					<li><strong>⭐️</strong> to toggle them as favorited</li>
					<li><strong>🌐</strong> Bing search for the artist</li>
					<li><strong>🎨🧑🏞️</strong> rotate between the 3 prompts</li>
					<li><strong>model</strong> switch between vanilla SDXL (A) and another model (B)</li>
				</ul>
				<h3>B: Model</h3>
				<ul>
					<li>Allows you to select a second XL model (B) to compare with the vanilla XL model from Stability (A).
					Switch between A and B by tapping the matching button on an artist.</li>
					<li>These models were selected by me based on what I prefer.  I have no relationship with these model makers.</li>
					<li><strong>DynaVision:</strong>
						<ul>
							<li>Makes cute faces, removes artifacts, saturates colors, while preserving artist style.</li>
							<li>Makes cleaner and smoother images at the expense of grungier styles.</li>
							<li>For landscapes, it reduces artist style strongly but improves composition.</li>
							<li>Improves anatomy and leans towards NSFW.  Proportions are somewhat cartoonish.</li>
							<li>To remove the "big eyes" effect, use "anime" in the negative prompt.</li>
						</ul>
					</li>
					<li><strong>Crystal Clear:</strong>
						<ul>
							<li>Adds detail and removes artifacts while while strongly preserving artist style.</li>
							<li>Preserves styles even for landscapes and even for messy/grungy artists.</li>
							<li>Makes faces more aesthetic, improves anatomy, and leans towards realism.</li>
						</ul>
					</li>
				</ul>
				<h3>Permissive filter</h3>
				<ul>
					<li><strong>checked:</strong> artists matching <strong>any</strong> checked tags</li>
					<li><strong>unchecked:</strong> artists matching <strong>all</strong> checked tags</li>
					<li>useful for filtering your favorites</li>
				</ul>
				<h3>Hide low-use tags</h3>
				<ul>
					<li><strong>checked:</strong> hides tags that match less than 4 artists, ~50% of all tags</li>
					<li>you can access hidden tags via search, or if they're marked as important</li>
				</ul>
				<h3>Hide unknown to SDXL</h3>
				<ul>
					<li>I've hand verified that SDXL doesn't know these artists' styles</li>
					<li>If you prompt with their names, the result will be unlike their actual style and generic, and you can achieve similar results by prompting "a painting", etc.</li>
					<li>They're included in the database for the record of what SDXL doesn't know</li>
				</ul>
				<h3>Don't blur risqué</h3>
				<ul>
					<li>Risqué means any image that isn't G-rated and 100% SFW by extremely conservative standards.  But the most risqué this site gets is images with boobies.</li>
				</ul>
				<h3>Important tags</h3>
				<ul>
					<li>Tap <strong>edit</strong> under the important category to add or remove tags to that category.  This lets you save your "favorite" tags for easier access.</li>
				</ul>
				<h3>Build a prompt</h3>
				<ul>
					<li>See 📸 prompts</li>
				</ul>
				<h3>But wait, there's more...</h3>
				<ul>
					<li>Quickly toggle any tag by typing the / key, then typing the first few letters of the tag</li>
					<li>Need inspo?  Try the "see some random tags" button from the search tab.  Does what it says on the tin</li>
					<li>"Copy visible artist names" from the search tab lets you export all artists that match you filters as plain text</li>
					<il>The export tab lets you copy data from one device to another</il>
				</ul>
				<h3>Why does the 🎨 prompt sometimes match the 🧑 or 🏞️ prompt?</h3>
				<ul>
					<li>
						The prompt used for the 🎨 images is the intentionally generic, "an image".  If that results in a portrait, that's useful to know.  It indicates that, for that artist, SDXL is more strongly trained to output portraits.  Anything in your prompt that's not related to a person will harder to prompt for in that artist's style.
					</li>
				</ul>
				<h3>✍️ Offline tag-editing mode</h3>
				<ul>
					<li>This feature is only for editing tags offline.  If you are viewing this from Hugging Face, any tag edits won't be applied, but they'll be saved.  If you've downloaded the repository and are viewing your local file, tag edits are applied.  In both cases, your edits will be available for export 📥 as text.  If you want to suggest tag improvements for everyone's benefit, edit tags, copy the text from 📥, and post it as a comment to Hugging Face.  I will incorporate accurate edits ASAP.  Thank you for contributing!</li>
				</ul>
			</div>
		</div>
		<div id="information_tips" class="information_section">
			<div>
				<h3>Building prompts from artist styles</h3>
				<ul>
					<li>Build-a-prompt uses auto1111 syntax, and it creates a 3-section prompt:</li>
					<li><b>(</b><i>artist stuff</i><b>:1.5)</b>, <b>(</b>an image<b>:0.5)</b>, <b>(</b><i>your prompt words</i><b>:1.0)</b></li>
					<li>Options:
						<ul>
							<li><strong>Intensity:</strong>
								<ul>
									<li>i.e. ✖1, ✖2, ✖3, gives more weight to a style by repeating the artist's name.  This works better than using prompt weighting</li>
								</ul>
							</li>
							<li><strong>Mixing method:</strong>
								<ul>
									<li><strong>Add:</strong> puts all the artists' names in the prompt separated by a comma.  Usually the best choice.  Try 'add' and 'loop' and see which works better.</li>
									<li><strong>Loop:</strong> uses a1111 syntax for alternating the prompt at each step.  This alternates which artist's name appears in the prompt.  If an artist's name is repeated, then it's repeat for multiple steps.</li>
									<li><strong>Swap:</strong> uses a1111 syntax to swap the prompt after a fraction of the total steps.  This swaps the artist's name after 50% of steps by default.  You can change this fraction.  For example, <b>[</b>A<b>:</b>B<b>:</b>0.1<b>]</b> switches to B after 10% of all steps.</li>
								</ul>
							<li><strong>Move left and right:</strong>
								<ul>
									<li>tokens closest to the start of the prompt always have more influence.  Therefore, moving an artist's name to the left adds weight to that style.</li>
								</ul>
							</li>
						</ul>
					</li>
				</ul>
				<h3>Why this prompting method?</h3>
				<ul>
					<li>The reason why build-a-prompt uses 3-sections is that it's very easy for common words in a prompt to erase an artist's style.  For example, for some artists that never made any portraits, using the word "portrait" in your prompt can erase their style entirely.</li>
					<li>To overcome this, we add weight to the <i>artist stuff</i> and to remove weight from the <i>rest of the prompt</i>.  Built a prompt weights this at <b>1.5</b> and <b>1.0</b> respectively.  This gives slightly more weight to the <i>artist stuff</i>.  As you edit the <i>rest of the promt</i>, if the style disappears, adjust both numbers, e.g. try <b>2.0</b> and <b>0.5</b>.</li>
					<li>The middle section, "<b>(</b>an image<b>:0.5)</b>" doesn't change the output at all.  However, it's sometimes needed when the weight of the <i>rest of the prompt</i> weight is less than 1.</li>
				</ul>
				<h3>An artist's style includes much more than their medium</h3>
				<ul>
					<li>Using an artists name influences the output in several ways beyond the medium, e.g. "painting style".  It includes typical subject matter, colors palette, clothing and hairstyles of the artist's time, composition and layout, even specific faces of people, and other aesthetic choices.</li>
					<li>It can be hard to get just the aesthetic style and not the other stuff, e.g. a renaissance painting style with modern clothing.</li>
					<li>Sometimes you can strengthen just the artist's style by putting their medium in the prompt like this:
						<ul>
							<li><b>(</b><strong>watercolor</strong> in the style of <i>artist full name</i><b>:1.5)</b>, <b>(</b>an image<b>:0.5)</b>, <b>(</b><i>content stuff</i><b>:1.0)</b></li>
						</ul>
					</li>
					<li>This helps especially when the artist is famous for multiple mediums.  But sometimes it reduces the artist's specific style and more matches the generic style of the medium.</li>
					<li>Also try adding the <strong>opposite</strong> medium/style to the <strong>negative</strong> prompt.  For example, if the artist you want is a photographer, try "painting, illustration" in the negative prompt.</li>
				</ul>
				<h3>Making non-photographic mediums look more photographic</h3>
				<ul>
					<li>It's worth trying "photograph by <i>illustration artist</i>" along with "illustration" in the negative prompt.  But that often won't work.</li>
					<li>It's also worth trying "<b>[</b><i>by artist A</i><b>:</b><i>style of photograph</i><b>:0.5]</b>".  This will start with the artist style and switch to photograph style after 50% of the steps.  Adjust the decimal as needed.</li>
					<li>I've had best results by sending the output to img2img, then replacing the artist's name in the prompt with "photograph", and setting the de-noise very low.  Then feed the result back to img2img, and slowly nudge it towards photographic.  That will at least maintain the composition.</li>
					<li>If Reference Controlnet for SDXL has been released, that should work well.</li>
				</ul>
			</div>
		</div>
		<div id="information_about" class="information_section">
			<div>
				<h3>SDXL Artist Style Explorer</h3>
				<ul>
					<li>Code and tagging by <a href="https://huggingface.co/mattthew" target="_blank">Mattthew</a></li>
				</ul>
				<h3>How to support this project</h3>
				<ul>
					<li>Please tell a friends or share on your socials</li>
					<li>Suggest artists I should add or remove</li>
					<li>Suggest features and report bugs</li>
					<li>Leave all feedback on <a href="https://huggingface.co/spaces/mattthew/SDXL-artists-browser/discussions" target="_blank">Huggingface</a></li>
				</ul>
				<h3>Workflow for almost all of these images</h3>
				<ul>
					<li>
						<strong>All:</strong><br>
						Steps: 20, Sampler: DPM++ 2M Karras, CFG scale: 5, Seed: 47, Size: 1024x1024, Model hash: 31e35c80fc, Model: sd_xl_base_1.0, Version: v1.5.1, <strong>(refiner not used)</strong>
					</li>
					<li>
						<strong>🎨 prompt:</strong><br>
						<b>(</b>artwork in the style of<i>artist full name</i><b>:1.5)</b>, <b>(</b>an image<b>:1.5)</b></li>
						<strong>negative:</strong><br>
						edges, borders
					</li>
					<li>
						<strong>🧑 prompt:</strong><br>
						<b>(</b>artwork in the style of<i>artist full name</i><b>:1.5)</b>, <b>(</b>an image<b>:0.5)</b>, <b>(</b>portrait of a person, inside a place<b>:1.0)</b></li>
						<strong>negative:</strong><br>
						edges, borders, outside, about, the artist, themselves
					</li>
					<li>
						<strong>🏞️ prompt:</strong><br>
						<b>(</b>artwork in the style of<i>artist full name</i><b>:1.5)</b>, <b>(</b>an image<b>:0.5)</b>, <b>(</b>landscape, outdoor natural scenery, water, bridge<b>:1.0)</b></li>
						<strong>negative:</strong><br>
						edges, borders, inside, people, person
					</li>
					<li>
						<strong>exceptions:</strong><br>
						For most photographers, "artwork in the style of <i>name</i>" was replaced with "by <i>name</i>".  Rarely, seed 48 was used.  For Dynavision I used negative prompt keywords to reduce NSFW.</li>
				</ul>
				<h3>Disclaimers</h3>
				<ul>
					<li>The tags are mostly my manual input, with a mix of other sources including AI.  They may be incorrect!</li>
					<li>SDXL is only a crude imitation of these artists.  Check out these artists' actual artwork for more inspiration!</li>
					<li>This database has more straight white male artists than in the actual population.  That's because they've been favored by art-collectors, past and present.  Please suggest non white male artists that I should add.</li>
					<li>My code doesn't use cookies, and it sends nothing to any server.  But it's hosted on Hugging Face, and I can't control if they cookie you.</li>
					<li>This tool is open source and Creatives Commons license.  Download for free, use offline, modify as you wish.</li>
					<li>I don't get, nor do I want, any compensation for this.  Getting thanked feels great though!</li>
					<li>I'm not affiliated with Stability AI or any model makers.</li>
					<li>This tools is only for fun.  Use at your own risk.  You're responsible for your own actions.  Void where prohibited.</li>
				</ul>
			</div>
		</div>
		<div id="information_export" class="information_section">
			<div>
				<h3>Export/Import favorited artists</h3>
				<textarea id="export_favorites_list" value="" placeholder="You haven't favorited any artists yet." autocomplete="off"></textarea>
				<div class="buttons">
					<div id="export_favorites_button">copy to clipboard</div>
					<div id="import_favorites_button">import</div>
				</div>
				<h3>Export tag-edits to send to author</h3>
				<textarea id="export_edits_list" value="" placeholder="You haven't edited any tags yet." autocomplete="off" disabled="true"></textarea>
				<div class="buttons">
					<div id="export_edits_button">copy to clipboard</div>
					<div id="delete_edits_button">restore official database</div>
				</div>
				<h3>Export database</h3>
				<textarea id="export_artists_list" value="" placeholder="If this is visible, there's a bug" autocomplete="off" disabled="true"></textarea>
				<div class="buttons">
					<div id="export_artists_button">copy to clipboard</div>
				</div>
			</div>
		</div>
	</div>
	<div id="alert"></div>
</body>
</html>