Cover for Design with Code

Mikolaj Dobrucki · Prototyping · Intermediate · Free · Self-paced

Design with Code

Who it is for: Product designers who need to evaluate AI-generated UI and ship in real codebases

Our verdict: Free designer-first code literacy so you can direct AI builders with precision, not become an engineer.

Why it made the cut

Go to course (non-affiliate)

Design with Code is a free, self-paced course for designers who need enough HTML, CSS, React, and tooling literacy to direct AI code editors, inspect output in DevTools, and collaborate with engineers without waiting on every tweak.

The outline runs from setup through web fundamentals, building a real app, and a dedicated Design with AI part. Exercises include prompt hints when you stall.

Caveat: this is code-for-designers, not generative-UI theory. Bring basic Figma fluency; expect to install a code editor.