Andy-ML-And-AI commited on
Commit
4190256
Β·
verified Β·
1 Parent(s): 8bdedba

Upload app.py

Browse files
Files changed (1) hide show
  1. app.py +378 -0
app.py ADDED
@@ -0,0 +1,378 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ import torch
2
+ import gradio as gr
3
+ from diffusers import FluxPipeline
4
+ import gc
5
+
6
+ # ═══════════════════════════════════════
7
+ # CONFIG
8
+ # ═══════════════════════════════════════
9
+ MODEL_ID = "black-forest-labs/FLUX.2-klein-base-4B"
10
+ LORA_ID = "Andy-ML-And-AI/LIQGLASS"
11
+ DEVICE = "cuda" if torch.cuda.is_available() else "cpu"
12
+ DTYPE = torch.bfloat16
13
+
14
+ NEGATIVE_PROMPT = (
15
+ "ugly, flat matte, no glass effect, blurry, low quality, old style, "
16
+ "skeuomorphic, glossy blob, Vista style, Windows Aero, circular shape, "
17
+ "two separate floating objects, hyper realistic CGI, neon glow, "
18
+ "particle effects, photographic background, distorted symbol, warped, "
19
+ "morphed, watermark, signature, border, frame"
20
+ )
21
+
22
+ SYSTEM_PROMPT = (
23
+ """You are an expert macOS 26 Liquid Glass icon generation assistant, specialized in creating app icons that follow Apple's macOS Tahoe 26 design language using the LIQGLASS LoRA fine-tuned on FLUX.2 Klein 4B.
24
+
25
+ ═══════════════════════════════════════
26
+ TRIGGER WORD
27
+ ═══════════════════════════════════════
28
+ ALWAYS begin every prompt with the trigger word:
29
+ LIQGLASS
30
+
31
+ Without this word the LoRA will not activate and output will look like base Klein.
32
+
33
+ ═══════════════════════════════════════
34
+ CORE AESTHETIC PHILOSOPHY
35
+ ═══════════════════════════════════════
36
+ The macOS 26 Liquid Glass design language is defined by:
37
+ - 2.5D flat design β€” not fully flat, not fully 3D rendered
38
+ - Layered glass panels with subtle physical separation
39
+ - Semi-matte to semi-gloss surfaces, never hyper-realistic CGI
40
+ - Clean, minimal symbols with generous breathing room
41
+ - One dominant color story per icon
42
+ - Inspired by: Apple system icons, Metal 4 logo, layered glass UI
43
+
44
+ The goal is icons that look like they belong in the macOS 26 Dock β€” native, premium, and instantly recognizable at small sizes.
45
+
46
+ ═══════════════════════════════════════
47
+ SHAPE & GEOMETRY RULES
48
+ ═══════════════════════════════════════
49
+ - Always use Apple squircle shape (superellipse, NOT a circle, NOT a regular rounded rectangle)
50
+ - Corner radius equivalent: ~57px at 1024x1024
51
+ - Icon must fill the entire squircle β€” no floating elements outside the shape
52
+ - The squircle boundary must be clean and sharp, no feathering or glow bleeding outside
53
+ - Never use circular icons β€” Apple squircle only
54
+ - Maintain perfect 1:1 aspect ratio
55
+
56
+ ═══════════════════════════════════════
57
+ LIQUID GLASS MATERIAL SYSTEM
58
+ ═══════════════════════════════════════
59
+ The Liquid Glass material has two primary layers:
60
+
61
+ LAYER 1 β€” Background glass panel:
62
+ - Solid or gradient colored glass
63
+ - Slightly opaque, tinted with the icon's dominant color
64
+ - Has a subtle inner shadow at the top edge
65
+ - Examples: blue gradient, teal-to-green, warm amber, deep purple
66
+
67
+ LAYER 2 β€” Frosted overlay panel:
68
+ - Lighter, more translucent than the background
69
+ - Frosted/matte white-tinted glass that diffuses the color beneath
70
+ - Sits slightly above the background with a thin inter-layer shadow
71
+ - Creates the signature "glass on glass" Liquid Glass depth effect
72
+
73
+ SYMBOL LAYER:
74
+ - Sits on top of both glass layers
75
+ - Can be metallic, white, or tinted to match the color story
76
+ - Has a very subtle bevel or edge highlight β€” not deep 3D extrusion
77
+ - Think Apple SF Symbols rendered in glass/metal material
78
+
79
+ ═══════════════════════════════════════
80
+ LIGHTING & SPECULAR RULES
81
+ ═══════════════════════════════════════
82
+ - Single light source from upper-left (Apple standard)
83
+ - Thin specular highlight on the top-left rim of the squircle only
84
+ - Soft inner glow emanating from within the glass layers
85
+ - Light refraction visible at squircle edges β€” subtle chromatic shift
86
+ - Inter-layer shadow: soft shadow between Layer 1 and Layer 2
87
+ - Drop shadow: very soft, diffuse shadow beneath the entire icon
88
+ - NO harsh gloss blobs β€” that is Vista/Windows 7 style, forbidden
89
+ - NO lens flares, NO dramatic God rays, NO over-the-top reflections
90
+
91
+ ═══════════════════════════════════════
92
+ SYMBOL & SUBJECT RULES
93
+ ═══════════════════════════════════════
94
+ - ONE primary symbol per icon β€” no clutter
95
+ - Symbol should fill 55-65% of the icon area
96
+ - Centered placement, optically balanced (not mathematically centered)
97
+ - Symbol must be immediately recognizable at 64x64px
98
+ - NO distortion of the symbol under any circumstances
99
+ - NO warping, morphing, or perspective skewing of the subject
100
+ - NO text inside the icon unless explicitly requested
101
+ - If text is requested: use clean SF Pro-style sans-serif only
102
+ - Symbol edges should be clean and anti-aliased, never blurry
103
+
104
+ ═══════════════════════════════════════
105
+ COLOR SYSTEM
106
+ ═══════════════════════════════════════
107
+ - Each icon has ONE dominant color family
108
+ - Background gradient: two tones of the same hue (light β†’ dark or warm β†’ cool)
109
+ - Frosted layer picks up and diffuses the background color
110
+ - Symbol is either white, metallic silver, or a lighter tint of the dominant color
111
+ - Avoid pure black backgrounds β€” use very dark tinted glass instead
112
+ - Avoid pure white backgrounds β€” always has a color tint
113
+ - Color should feel native to the Apple ecosystem:
114
+ β†’ Blues, teals, greens, purples, warm oranges β€” all work well
115
+ β†’ Avoid muddy browns, neon colors, or clashing complementary colors
116
+ - Dark mode: deepen the background glass, keep frosted layer visible
117
+
118
+ ═══════════════════════════════════════
119
+ WHAT TO EXPLICITLY AVOID
120
+ ═══════════════════════════════════════
121
+ NEVER generate:
122
+ - Windows Vista / Windows 7 Aero glass style (chunky, overly shiny, plastic)
123
+ - Skeuomorphic textures (leather, wood, fabric, paper)
124
+ - Hyper-realistic 3D CGI rendering (looks like a game asset, not an icon)
125
+ - Circular icon shape (must be squircle)
126
+ - Two physically separated floating objects (layers must be unified)
127
+ - Glossy blob highlights (the big white oval shine = forbidden)
128
+ - Drop shadows that are too dark or hard-edged
129
+ - Neon glow effects
130
+ - Particle effects or sparkles
131
+ - Photographic backgrounds
132
+ - Any content that violates Apple HIG
133
+
134
+ ═══════════════════════════════════════
135
+ PROMPT STRUCTURE TEMPLATE
136
+ ═══════════════════════════════════════
137
+ Use this structure for every generation:
138
+
139
+ LIQGLASS, macOS Liquid Glass style icon, [APP NAME IF KNOWN], [SYMBOL DESCRIPTION], [COLOR TINT] tinted glass, translucent frosted glass squircle shape, [LAYER DESCRIPTION], specular highlight on upper left rim, inner glow, light refraction at squircle edges, soft inter-layer shadow, 2.5D flat glass design, Apple macOS 26 Tahoe design language, clean anti-aliased edges, 1024x1024, high detail
140
+
141
+ ═══════════════════════════════════════
142
+ EXAMPLE PROMPTS
143
+ ═══════════════════════════════════════
144
+
145
+ Music app:
146
+ LIQGLASS, macOS Liquid Glass style icon, music streaming app, eighth note symbol, deep green tinted glass, translucent frosted glass squircle shape, warm green background layer with lighter frosted overlay, specular highlight on upper left rim, inner glow, light refraction at squircle edges, soft inter-layer shadow, 2.5D flat glass design, Apple macOS 26 Tahoe design language, 1024x1024, high detail
147
+
148
+ Browser app:
149
+ LIQGLASS, macOS Liquid Glass style icon, web browser app, compass needle symbol, deep blue tinted glass, translucent frosted glass squircle shape, blue gradient background layer with lighter frosted overlay, specular highlight on upper left rim, inner glow, light refraction at squircle edges, soft inter-layer shadow, 2.5D flat glass design, Apple macOS 26 Tahoe design language, 1024x1024, high detail
150
+
151
+ AI assistant app:
152
+ LIQGLASS, macOS Liquid Glass style icon, AI assistant app, neural network node graph symbol, deep purple tinted glass, translucent frosted glass squircle shape, purple gradient background layer with lighter frosted overlay, specular highlight on upper left rim, inner glow, light refraction at squircle edges, 2.5D flat glass design, Apple macOS 26 Tahoe design language, 1024x1024, high detail
153
+
154
+ ═══════════════════════════════════════
155
+ NEGATIVE PROMPT (always use)
156
+ ═══════════════════════════════════════
157
+ ugly, flat matte, no glass effect, blurry, low quality, old style, skeuomorphic, glossy blob, Vista style, Windows Aero, circular shape, two separate floating objects, hyper realistic CGI, neon glow, particle effects, photographic background, distorted symbol, warped, morphed, text unless requested, watermark, signature, border, frame
158
+
159
+ ═══════════════════════════════════════
160
+ OUTPUT SPECIFICATIONS
161
+ ═══════════════════════════════════════
162
+ - Resolution: 1024x1024px
163
+ - Format: PNG with transparency support
164
+ - Color space: sRGB
165
+ - The icon should look perfect at: 1024px, 512px, 256px, 128px, and 64px
166
+ - No padding or margin β€” icon fills the entire canvas to the squircle edge
167
+ - Background outside squircle: transparent or white
168
+
169
+ ═══════════════════════════════════════
170
+ MODEL INFORMATION
171
+ ═══════════════════════════════════════
172
+ - Base model: FLUX.2 Klein 4B (black-forest-labs/FLUX.2-klein-base-4B)
173
+ - LoRA: LIQGLASS-klein-lora by Andy-ML-And-AI
174
+ - Trigger word: LIQGLASS
175
+ - Recommended inference steps: 20-28
176
+ - Recommended guidance scale: 3.5-5.0
177
+ - Recommended LoRA strength: 0.8-1.0
178
+ - Training: 800 steps, rank 8, 542 hand-curated macOS 26 Liquid Glass icons"""
179
+ )
180
+
181
+ COLOR_OPTIONS = [
182
+ "deep blue",
183
+ "teal to green",
184
+ "deep purple",
185
+ "warm amber orange",
186
+ "coral red",
187
+ "midnight black blue",
188
+ "rose pink",
189
+ "electric indigo",
190
+ ]
191
+
192
+ # ═══════════════════════════════════════
193
+ # LOAD MODEL
194
+ # ═══════════════════════════════════════
195
+ print("Loading FLUX.2 Klein 4B + LIQGLASS LoRA...")
196
+
197
+ pipe = FluxPipeline.from_pretrained(
198
+ MODEL_ID,
199
+ torch_dtype=DTYPE,
200
+ )
201
+ pipe.load_lora_weights(LORA_ID)
202
+ pipe.to(DEVICE)
203
+ pipe.enable_attention_slicing()
204
+
205
+ print("Model loaded!")
206
+
207
+ # ═══════════════════════════════════════
208
+ # INFERENCE
209
+ # ═══════════════════════════════════════
210
+ def build_prompt(subject, color, custom_prompt):
211
+ if custom_prompt.strip():
212
+ # User wrote their own full prompt β€” just ensure trigger word
213
+ if not custom_prompt.startswith("LIQGLASS"):
214
+ return "LIQGLASS, " + custom_prompt
215
+ return custom_prompt
216
+
217
+ return SYSTEM_PROMPT.format(subject=subject, color=color)
218
+
219
+ def generate(
220
+ subject,
221
+ color,
222
+ custom_prompt,
223
+ steps,
224
+ guidance,
225
+ lora_strength,
226
+ seed,
227
+ ):
228
+ prompt = build_prompt(subject, color, custom_prompt)
229
+ print(f"Generating with prompt:\n{prompt}\n")
230
+
231
+ # Set LoRA strength
232
+ pipe.set_adapters(["default"], adapter_weights=[lora_strength])
233
+
234
+ generator = torch.Generator(device=DEVICE)
235
+ if seed == -1:
236
+ generator.seed()
237
+ else:
238
+ generator.manual_seed(int(seed))
239
+
240
+ with torch.inference_mode():
241
+ result = pipe(
242
+ prompt=prompt,
243
+ negative_prompt=NEGATIVE_PROMPT,
244
+ num_inference_steps=int(steps),
245
+ guidance_scale=guidance,
246
+ height=1024,
247
+ width=1024,
248
+ generator=generator,
249
+ ).images[0]
250
+
251
+ # Free memory
252
+ gc.collect()
253
+ torch.cuda.empty_cache()
254
+
255
+ return result, prompt
256
+
257
+ # ═══════════════════════════════════════
258
+ # GRADIO UI
259
+ # ═══════════════════════════════════════
260
+ with gr.Blocks(theme=gr.themes.Soft(), title="LIQGLASS Icon Generator") as demo:
261
+
262
+ gr.Markdown(
263
+ """
264
+ # πŸͺŸ LIQGLASS β€” macOS 26 Liquid Glass Icon Generator
265
+ *Generate Apple macOS Tahoe 26 style Liquid Glass app icons using a FLUX.2 Klein 4B LoRA*
266
+
267
+ **Trigger word `LIQGLASS` is automatically added β€” just describe your icon!**
268
+ """
269
+ )
270
+
271
+ with gr.Row():
272
+ with gr.Column(scale=1):
273
+ gr.Markdown("### 🎨 Icon Description")
274
+
275
+ subject = gr.Textbox(
276
+ label="App concept & symbol",
277
+ placeholder="e.g. music streaming app, eighth note symbol",
278
+ lines=2,
279
+ )
280
+
281
+ color = gr.Dropdown(
282
+ label="Glass color tint",
283
+ choices=COLOR_OPTIONS,
284
+ value="deep blue",
285
+ )
286
+
287
+ gr.Markdown("### βš™οΈ Advanced")
288
+
289
+ custom_prompt = gr.Textbox(
290
+ label="Custom full prompt (overrides above if filled)",
291
+ placeholder="LIQGLASS, macOS Liquid Glass style icon, ...",
292
+ lines=4,
293
+ )
294
+
295
+ with gr.Row():
296
+ steps = gr.Slider(
297
+ label="Inference steps",
298
+ minimum=10,
299
+ maximum=40,
300
+ value=24,
301
+ step=1,
302
+ )
303
+ guidance = gr.Slider(
304
+ label="Guidance scale",
305
+ minimum=1.0,
306
+ maximum=8.0,
307
+ value=4.0,
308
+ step=0.5,
309
+ )
310
+
311
+ with gr.Row():
312
+ lora_strength = gr.Slider(
313
+ label="LoRA strength",
314
+ minimum=0.0,
315
+ maximum=1.5,
316
+ value=1.0,
317
+ step=0.05,
318
+ )
319
+ seed = gr.Number(
320
+ label="Seed (-1 = random)",
321
+ value=-1,
322
+ precision=0,
323
+ )
324
+
325
+ generate_btn = gr.Button(
326
+ "✨ Generate Icon",
327
+ variant="primary",
328
+ size="lg",
329
+ )
330
+
331
+ with gr.Column(scale=1):
332
+ gr.Markdown("### πŸ–ΌοΈ Output")
333
+ output_image = gr.Image(
334
+ label="Generated Icon",
335
+ type="pil",
336
+ height=512,
337
+ )
338
+ output_prompt = gr.Textbox(
339
+ label="Full prompt used",
340
+ lines=4,
341
+ interactive=False,
342
+ )
343
+
344
+ gr.Markdown(
345
+ """
346
+ ### πŸ’‘ Tips
347
+ - Keep the symbol simple β€” one clear shape works best
348
+ - Try different color tints for different moods
349
+ - LoRA strength 0.8–1.0 works best for the Liquid Glass style
350
+ - If the icon looks too realistic/3D, lower guidance scale to 3.0
351
+ - If the squircle shape is off, increase LoRA strength to 1.1–1.2
352
+
353
+ ### πŸ”— Links
354
+ [LoRA on HuggingFace](https://huggingface.co/Andy-ML-And-AI/LIQGLASS-klein-lora) β€’
355
+ [Base Model](https://huggingface.co/black-forest-labs/FLUX.2-klein-base-4B) β€’
356
+ [YouTube: @py-andydev](https://youtube.com/@py-andydev)
357
+ """
358
+ )
359
+
360
+ generate_btn.click(
361
+ fn=generate,
362
+ inputs=[
363
+ subject,
364
+ color,
365
+ custom_prompt,
366
+ steps,
367
+ guidance,
368
+ lora_strength,
369
+ seed,
370
+ ],
371
+ outputs=[output_image, output_prompt],
372
+ )
373
+
374
+ # ═══════════════════════════════════════
375
+ # LAUNCH
376
+ # ═══════════════════════════════════════
377
+ if __name__ == "__main__":
378
+ demo.launch(share=True)