Leon Lin

@LexnLin • 31,788 subscribers

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

Shorts

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

84,274 просмотров

Testing models from other providers in Codex 👀

226,458 просмотров

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

28,821 просмотров

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 просмотров

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 просмотров

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 просмотров

$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 просмотров

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 просмотров

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

76,937 просмотров

Done. Codex and images 2.0 cooked

61,425 просмотров

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 просмотров

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 просмотров

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 просмотров

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 просмотров

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

25,012 просмотров

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 просмотров

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 просмотров

Figure bro uhm package just fell down

19,543 просмотров

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 просмотров

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)

Testing models from other providers in Codex 👀

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

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

earshot v0.3 is out! added: - a library of 201 sounds, all made with code - earshot kit can create a whole sound kit - earshot sfx times a sound to the exact frame (improved) plus earshot is now used in cinetic (skill for creating motion design) will continue improving it!

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!

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

TasteSkill v2.1 is out! this time we went all in on dashboards and the small details go create better websites with tasteskill now and some dashboards :) npx skills add Leonxlnx/taste-skill

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!

I asked Opus 5.5 to build an alpine lake EVERYTHING is code. no assets were used. even the music and nature sounds are synthesized

I made a video with Opus 5.5 where 260k+ voxels turn into random things (a cube, a meadow, a storm, a ferrofluid, a galaxy,...) everything is made with JS sounds on! :)

WOAH Claude Desktop app has a new UI!

Cinetic v1.1 is here! Cinetic is my skill for creating good motion designs/launch videos some changes: - text elements are shorter now - calmer pacing by default - every sound is made in code with earshot this video was made with cinetic

Opus 5.5 painted 10 chinese landscapes everything you see and hear is code, ~22k lines of JavaScript yes even the sfx and the background music are made with code as well :)

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

Opus 5.5 built a golden hour japanese temple in threejs

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

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!

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

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

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

This is made by Opus 5.5 high. sfx improved

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