Amateur vs Pro: Advanced UI Design with Replit Design & Gemini 3 Pro

Try Replit Design mode today at https://replit.com/refer/chrisbgp

🚀 Join my community and start building your AI app today @ https://www.skool.com/aiapps
💡 Get 100s of validated app ideas and the prompts to build FREE @ https://readytobuild.app/

Gemini 3 Pro just dropped and it is incredibly good at UI design. So I put it to the test with Replit’s new design mode that uses Gemini 3 Pro under the hood – to see just how good the UI design is vs standard AI design output.

Long story short, the difference is crazy. And in this video I walk through how to use Replit’s design mode, how to improve the UI design for your AI built app, and why Gemini 3 Pro might be the best AI model for design right now.

Chapters:

01:00 – What Replit Design Mode is ​⁠
02:35 – Why design-first workflow
04:10 – Set up: Build vs Design tabs
06:43 – First design pass (agent run)
07:13 – Compare: Default build vs design
09:05 – Design references + workflow
10:18 – Apply screenshot styling (prompt)
13:34 – Result: polished dashboard
14:52 – Tweak fonts, spacing, charts
15:20 – Bar chart update (select area)
17:05 – Color system unification
18:03 – Dark mode style reference
20:13 – Font direction: display + mono
22:22 – Result: typography upgrade
23:22 – Card styling: gradient strokes
25:17 – Graph polish: grid + axes
26:05 – Final UI showcase
26:41 – Takeaways: where Gemini 3 shines

Key points:

– I walk through Replit design mode and how it works

– I create the same app from the same prompt using the regular build mode and design mode, and compare the 2 outputs on design quality

– I use 2 different UI style references to see how well Replit design mode does at interpreting and changing the design for the app

Follow me on social:
https://www.linkedin.com/in/ashbychris/
https://x.com/chris_telescope

source