Leon Lin

@LexnLin • 30,029 subscribers

highschool | creative ai https://t.co/WAZzwj2wvN

Shorts

Claude Opus 5.5 made its own ad. (sound on) (prompt/strategy below)

82,077 views

Everything here is code. Made with Opus 5.5 All waves, palms, shadows, even the sounds, are generated by code.

28,821 views

Testing models from other providers in Codex 👀

226,458 views

Yup, no Gemini 4 Argon today. "We are working to get it to more people as safely as possible, as soon as possible."

21,791 views

asked GPT 6 Astra to build an ocean in the browser total time was around 5+ hours of coding way better than what I got with Fable and Opus

58,540 views

Introducing `images-taste skill` Now that GPT images v2 is out a new method of creating frontend in Codex has emerged. generate images -> codex analyzes them -> codex builds the website available here:

171,824 views

$Hold up, here is the prompt: works with almost any model. enjoy :) Role & Objective: Act as an Elite UI/UX Front-End Engineer specializing in Apple-tier micro-interactions and advanced CSS. Your task is to program a perfectly centered navigation bar in a strictly SINGLE HTML file containing all HTML, vanilla CSS, and vanilla JavaScript. No external libraries or frameworks (No Tailwind, React, etc.). Design Concept - "True Liquid Glass": CRITICAL INSTRUCTION: Do NOT generate standard, flat "glassmorphism" or basic frosted glass. I require a physically accurate "Liquid Glass" aesthetic. It must look like wet, poured clear resin, combining the high-gloss specular highlights of classic macOS Aqua with the volumetric spatial depth of modern Apple VisionOS. 1. The Liquid Glass Material & Lighting (CSS): - Deep Refraction: Use `backdrop-filter` with extreme blur (e.g., 50px) and over-saturation (200%). - Specular Highlight: Create a curved, semi-transparent white gradient on the top half using a pseudo-element (`::before`) to simulate a hard light reflection on a wet, rounded 3D surface. - Caustics & Volume: Use multi-layered inner and outer `box-shadow` properties to simulate light refracting at the bottom edge and casting a realistic ambient drop shadow. - Interactive Glare: Implement a soft radial-gradient spotlight inside the glass that dynamically tracks the user's mouse cursor (X/Y coordinates) using JavaScript and CSS variables (`mix-blend-mode: overlay`). 2. Navigation Layout & Elements: - Center the pill-shaped navigation bar perfectly in the middle of the viewport. - Include 3 main navigation items with minimalist, inline SVG stroke icons and text labels: "Home", "Call", and "List". - Add a subtle vertical divider line after the main buttons. - Next to the divider, add a Dark/Light Mode toggle button containing inline SVG Sun and Moon icons. 3. Animations & "Apple Magic": - Sliding Active Pill: Create a solid background "pill" that sits *behind* the active navigation item's text/icon. When a different item is clicked, this pill must dynamically recalculate its width and slide to the new position. - Spring Physics: The sliding transition MUST use an exact Apple-style bouncy spring easing curve (e.g., `transition: all 0.5s cubic-bezier(0.34, 1.2, 0.64, 1)`). - Tactile Feedback: Buttons and icons must physically press down slightly (`transform: scale(0.92)`) when clicked (`:active`). - Theme Switch: The Sun and Moon icons must smoothly rotate, scale, and cross-fade during the transition. 4. Background Environment (Crucial): - Glass needs light and color to refract! Create a full-viewport, smoothly animated mesh gradient background using 3 large, heavily blurred, floating color blobs. - Implement full Dark/Light mode logic using CSS variables (`:root` and `[data-theme="dark"]`). Toggling the theme must seamlessly transition the background blob colors, glass opacity, shadow intensity, and text colors. Output ONLY the pristine, production-ready code. Prioritize maximum visual fidelity and silky-smooth 60fps animations.$

Hold up, here is the prompt: works with almost any model. enjoy :) Role & Objective: Act as an Elite UI/UX Front-End Engineer specializing in Apple-tier micro-interactions and advanced CSS. Your task is to program a perfectly centered navigation bar in a strictly SINGLE HTML file containing all HTML, vanilla CSS, and vanilla JavaScript. No external libraries or frameworks (No Tailwind, React, etc.). Design Concept - "True Liquid Glass": CRITICAL INSTRUCTION: Do NOT generate standard, flat "glassmorphism" or basic frosted glass. I require a physically accurate "Liquid Glass" aesthetic. It must look like wet, poured clear resin, combining the high-gloss specular highlights of classic macOS Aqua with the volumetric spatial depth of modern Apple VisionOS. 1. The Liquid Glass Material & Lighting (CSS): - Deep Refraction: Use `backdrop-filter` with extreme blur (e.g., 50px) and over-saturation (200%). - Specular Highlight: Create a curved, semi-transparent white gradient on the top half using a pseudo-element (`::before`) to simulate a hard light reflection on a wet, rounded 3D surface. - Caustics & Volume: Use multi-layered inner and outer `box-shadow` properties to simulate light refracting at the bottom edge and casting a realistic ambient drop shadow. - Interactive Glare: Implement a soft radial-gradient spotlight inside the glass that dynamically tracks the user's mouse cursor (X/Y coordinates) using JavaScript and CSS variables (`mix-blend-mode: overlay`). 2. Navigation Layout & Elements: - Center the pill-shaped navigation bar perfectly in the middle of the viewport. - Include 3 main navigation items with minimalist, inline SVG stroke icons and text labels: "Home", "Call", and "List". - Add a subtle vertical divider line after the main buttons. - Next to the divider, add a Dark/Light Mode toggle button containing inline SVG Sun and Moon icons. 3. Animations & "Apple Magic": - Sliding Active Pill: Create a solid background "pill" that sits behind the active navigation item's text/icon. When a different item is clicked, this pill must dynamically recalculate its width and slide to the new position. - Spring Physics: The sliding transition MUST use an exact Apple-style bouncy spring easing curve (e.g., `transition: all 0.5s cubic-bezier(0.34, 1.2, 0.64, 1)`). - Tactile Feedback: Buttons and icons must physically press down slightly (`transform: scale(0.92)`) when clicked (`:active`). - Theme Switch: The Sun and Moon icons must smoothly rotate, scale, and cross-fade during the transition. 4. Background Environment (Crucial): - Glass needs light and color to refract! Create a full-viewport, smoothly animated mesh gradient background using 3 large, heavily blurred, floating color blobs. - Implement full Dark/Light mode logic using CSS variables (`:root` and `[data-theme="dark"]`). Toggling the theme must seamlessly transition the background blob colors, glass opacity, shadow intensity, and text colors. Output ONLY the pristine, production-ready code. Prioritize maximum visual fidelity and silky-smooth 60fps animations.

128,501 views

I mean it's pretty easy to vibecode this. Although somehow Gemini fumbled this one-shot because these things look at your password when you click on reveal 😭 But yeah one-shot in antigravity

99,445 views

Someone told me to build this masterpiece using AI Here is my result (prompt is below)

76,937 views

Done. Codex and images 2.0 cooked

61,425 views

Here is the prompt to create a liquid gold nav bar :) Have fun experimenting! Create a floating navigation toolbar centered on screen. Dark background, glassmorphism toolbar with blur and subtle border. Core feature - Golden active indicator ring: A sliding highlight around the active button built with 4 CSS layers: Glow - blurred warm gold (#e8af48) behind the ring, opacity: 0.15 Clip container - overflow: hidden, border-radius: 18px - this clips the gradient Rotating conic-gradient - sized 200% and offset -50% so it spins from center. Rotates 4.5s linear infinite. The gradient must be heavily gold-dominant:70% of the gradient = gold tones (#533517 dark bronze → #c49746 warm gold → #feeaa5 light gold) 2 narrow white hotspots (#ffffff, each only ~3% wide) simulating studio light reflections Between each white hotspot, a very thin (~1.5% each) hint of #ffc0cb pink and - blue for subtle chromatic iridescence - these must stay minimal, the ring should read as GOLD not rainbow The pattern repeats twice across 360° for symmetry Inner plate - inset: 2px covers the center, only 2px of spinning gold ring visible. Background matches toolbar. The indicator slides between buttons with bouncy overshoot easing (cubic-bezier(0.34, 1.2, 0.64, 1)). 3 nav buttons (Home, Search, User) with thin stroke icons, separated by subtle dividers. Plus a dark/light theme toggle - sun/moon icons crossfade with rotate+scale. On toggle click, the button bounces up to 1.25× scale then springs back. Add film grain noise overlay and radial ambient glow.

72,887 views

gemini pro 3.1 ui gen is cracked just one-shot a full landing page from "professional saas landingpage for an ai agent provider. 8sections. use micro animations"

73,471 views

I experimented with Muse Spark a bit more. I take my words back it seems to be quite okay. Muse Spark generated images for the website btw

46,920 views

Introducing GPT Taste Skill We all know that right now, ChatGPT still lags behind in frontend generation. That's why bluedev and I built GPT Taste Skill It's opensource! Test it here :)

39,500 views

gpt frontend is just 😔😭 it just ignores everything i write into the skills

25,012 views

Updating gpt-taste skill ⏳ this site was built with GPT 5.4 medium in Codex using gpt-taste prompt was "landing page. 8sections. for an AI agency"

25,714 views

GPT 5.4 medium in Codex + gpt-taste skill prompt was "landing page. 8sections. for an AI agency" here's the skill: Left: no skill Right: using skill

24,334 views

Figure bro uhm package just fell down

19,543 views

I tried to recreate the Meta AI animation using different AI models 1/ (top left) original 2/ (top right) Gemini 3.1 Pro High 3/ (bottom left) Muse Spark 4/ (bottom right) ChatGPT 5.4 Thinking Extended for this round, muse spark won

18,693 views

Videos

LIVE

1.2k

Anya Rossi

sweetdream.ai

SweetDream.ai•Sponsored•Livecam

Streaming Now

Watch Anya Live

Anya is streaming live right now! Join her private show and enjoy exclusive content.

HD live stream

Exclusive private shows

1.2k viewers online

Current Status

Live

Private Show

Join now for exclusive access

Free preview available • Premium content

Live Cam

Leon Lin

Shorts

Claude Opus 5.5 made its own ad. (sound on) (prompt/strategy below)

Everything here is code. Made with Opus 5.5 All waves, palms, shadows, even the sounds, are generated by code.

Testing models from other providers in Codex 👀

Yup, no Gemini 4 Argon today. "We are working to get it to more people as safely as possible, as soon as possible."

asked GPT 6 Astra to build an ocean in the browser total time was around 5+ hours of coding way better than what I got with Fable and Opus

Introducing `images-taste skill` Now that GPT images v2 is out a new method of creating frontend in Codex has emerged. generate images -&gt; codex analyzes them -&gt; codex builds the website available here:

I mean it's pretty easy to vibecode this. Although somehow Gemini fumbled this one-shot because these things look at your password when you click on reveal 😭 But yeah one-shot in antigravity

Someone told me to build this masterpiece using AI Here is my result (prompt is below)

Done. Codex and images 2.0 cooked

gemini pro 3.1 ui gen is cracked just one-shot a full landing page from "professional saas landingpage for an ai agent provider. 8sections. use micro animations"

I experimented with Muse Spark a bit more. I take my words back it seems to be quite okay. Muse Spark generated images for the website btw

Introducing GPT Taste Skill We all know that right now, ChatGPT still lags behind in frontend generation. That's why bluedev and I built GPT Taste Skill It's opensource! Test it here :)

gpt frontend is just 😔😭 it just ignores everything i write into the skills

Updating gpt-taste skill ⏳ this site was built with GPT 5.4 medium in Codex using gpt-taste prompt was "landing page. 8sections. for an AI agency"

GPT 5.4 medium in Codex + gpt-taste skill prompt was "landing page. 8sections. for an AI agency" here's the skill: Left: no skill Right: using skill

Figure bro uhm package just fell down

I tried to recreate the Meta AI animation using different AI models 1/ (top left) original 2/ (top right) Gemini 3.1 Pro High 3/ (bottom left) Muse Spark 4/ (bottom right) ChatGPT 5.4 Thinking Extended for this round, muse spark won

Videos

Watch Anya Live

I asked Opus 5.5 to build an ancient Greek world as detailed as possible no assets were used! everything you see here is made with code

We rebuilt TasteSkill from scratch And today we are introducing TasteSkill v2 v2 gives your coding agent an art direction, assets and a browser check to verify its work npx skills add Leonxlnx/taste-skill check out more examples below!

Introducing earshot Opus 5.5 can build a whole launch video in code but still produces sloppy sfx. so we built earshot. it's ears for AI coding agents. they can now hear sounds, judge them and even make their own good sounds. every sound in this video was made with code. (sound on!!)

You can really build anything now Clawd animation made with Opus 5.5 Ultracode. improved sfx!

WOAH Claude Desktop app has a new UI!

This is the 5th iteration/prompt with Opus 5.5 for my 3d browser game The world it created is HUGE

Opus 5.5 built a golden hour japanese temple in threejs

This is made by Opus 5.5 high. sfx improved

I asked GPT 6 Astra to compose a piano melody and build a 3D pianist to play it and holy fuck, the fingers do follow the actual notes PLUS this ONLY took about 2h

Point Lookout, North Stradbroke Island, Queensland, Australia made with opus-5.5 and gpt-6 astra

Opus 5.5 built a tiny world in a glass box you can: grab a cloud &gt; squeeze rain out of it shake it &gt; lightning "draw" wind using the wind brush and theres a day night cycle + seasons as well

"One More Prompt" a music video made by Opus 5.5. EVERYTHING you see is code! sound on :)

Claude Opus 5.5 built this 3D world. Keys 1-5 switch between five rendering styles: Natural, Painterly, Anime, Cartoon, Ultra. EVERYTHING is generated in code. No asset was used

We built TasteSkill to help people create better frontends with AI. Today we're introducing TasteCode A desktop app for your coding agents, with a dedicated Design Mode that avoids slop and instead produces good UI It is opensource and you can use it with your existing AI subscriptions!

I asked Claude Code (Opus 5.5) to make a launch video for a fake calendar app and HOLY fuck, everything you see AND hear is code ONE prompt, it cooked for about 8h name, logo, UI, animations, soundtrack, sound effects opensource, repo in replies :)

what the fuck guys, I'm just running my own 3d benchmark with Astra rn, WHAT THE FUCK is codex doing

every frame of this is painted with JavaScript made with Opus 5 (probably routed to 5.5), sounds on :)

Claude Opus 5.5 built a full open world game that runs in your browser zero assets. terrain, creatures, boss fight, animations, sound, music. all code it even cut this trailer and made the soundtrack (cover is image generated) play it:

built a weird experiment with GPT 6 Astra so there's a person sitting at a computer running a local model, you talk to him, he turns around and listens, then turns back to the PC and uses ai for you you can literally build anything now

Introducing `images-taste skill` Now that GPT images v2 is out a new method of creating frontend in Codex has emerged. generate images -> codex analyzes them -> codex builds the website available here:

Opus 5.5 built a tiny world in a glass box you can: grab a cloud > squeeze rain out of it shake it > lightning "draw" wind using the wind brush and theres a day night cycle + seasons as well