Build with AI
AI Agents & Digital Products
Work at your pace. Take a break between stages; there is no countdown.
You need: paper, a pencil and this lab. A helper is welcome for reading and discussion.Connect to what you know
You tested tool outputs. Apply the same care to a small page of code, whether written by you or suggested by AI.
Understand it, step by step
- 1
HTML describes content: h1 is a main heading, p a paragraph, and a a link. CSS changes presentation such as colour and spacing.
- 2
Read the starter before editing. Its heading names the topic, its paragraphs explain it, and an internal link jumps to a section.
- 3
Run a small change and inspect the result. Our preview is isolated: scripts and external requests are blocked. This lets you explore HTML/CSS without running untrusted code.
Change <h1> to name your invention. Add a paragraph saying who it helps. Link href="#how" to a section with id="how". The matching names make the jump work.
Pause and predict
What happens if the link and section names do not match?