Design
Draft the layout with Claude on a 12-column grid, using an 80px margin and 20px gutter.
BUDT748 · Fall 2026 · Client-Side Technologies
Today let's create a sample website design with Claude and build out its corresponding HTML and CSS code.
Three steps, start to finish.
Draft the layout with Claude on a 12-column grid, using an 80px margin and 20px gutter.
Convert the design into HTML and CSS, then style it in VS Code with the Live Server extension.
Push the finished site to GitHub and publish it for free with GitHub Pages.
A responsive navbar, the 12-column grid, styled buttons and form controls — all from the Bootstrap CDN, layered with custom CSS.