Philosophy
Each day in November, create a webpage with a specific constraint. The goal isn't perfection: it's exploration and creativity. All constraints are designed to maintain usable, accessible code while challenging your creative problem-solving.
Share your work, and have fun! I'll link to participants below.
30 Prompts
-
1No Color
Create a page using only black, white, and shades of gray. How expressive can monochrome be? -
2No Images
Make something interesting using only text, unicode, and CSS. No img tags, no backgrounds. -
3No Classes
Style your page without using any CSS classes. Element selectors, IDs, and attribute selectors only. -
4No External CSS
All styles must be inline or in a style tag. No separate stylesheet files. -
5No More Than 5 Colors
Limit your entire palette to five colors maximum. Choose wisely for hierarchy and emphasis. -
6No Typography Control
Use only the browser's default font. No font-family, no web fonts, no font-size changes. -
7No Paragraphs
Tell a story or share information without using a p tag. Lists, headings, blockquotes...get creative! -
8No Sharp Corners
Everything must be curved. Use border-radius, no 90-degree angles allowed. -
9No Repeating Elements
Each HTML element type can only be used once on the page. One h1, one p, one section, etc. -
10No Padding
Design your layout without using the padding property anywhere. Margins and borders only. -
11No White Backgrounds
No white backgrounds anywhere. Choose your palette carefully while maintaining contrast. -
12No More Than 3 Fonts
Limit yourself to three font families maximum across the entire page. -
13No Navigation Bars
Create a multi-section page with clear wayfinding but no traditional nav element or menu. -
14No Flexbox
Layout your page without using flex. Rediscover older layout methods or use grid and positioning. -
15No Horizontal Layouts
Everything flows vertically. No side-by-side elements, vertical composition from top to bottom. -
16No More Than 10 Elements
Build with only ten HTML elements (not counting html, head, body, meta, title). Choose wisely. -
17No Animations
Create visual interest and draw attention without CSS animations, transitions, or movement effects. -
18No Long Words
Write all content using only words of six letters or fewer. Brevity becomes your tool for clarity. -
19No Grid
Layout without CSS Grid. Challenge yourself with flexbox, floats, or other positioning methods. -
20No Gradients
Use only solid colors throughout. No linear-gradient, radial-gradient, or conic-gradient. -
21No Borders
Create visual separation and structure without using border properties. Spacing and color only. -
22No Background Colors
No background or background-color. Work with transparency and text color only. -
23No Lists
Organize information without ul, ol, or li tags. Find other semantic ways to present grouped content. -
24No Z-Index
Layer and overlap elements without using z-index. Rely on document flow and positioning order. -
25No Margin
Make a layout where no element usesmargin
. Explore padding, borders, and positioning. -
26No More Than 3 Sections
Organize all your content into three sections. How much can you communicate concisely? -
27No Absolute Positioning
Layout without position: absolute. Use relative, fixed, sticky, or static positioning only. -
28No Symmetry
Everything must be asymmetrical. No centering, no mirroring. Embrace intentional imbalance. -
29No IDs
Style and structure your page without using any ID selectors. Classes and element selectors only. -
30No Constraints
After 29 days of limitations, create anything you want. What will you choose?
Guidelines
Start small. Each day doesn't need a complete site. A single-page is perfect.
Document your process. Keep notes about what surprised you, what you discovered.
Accessibility first. All constraints should still produce usable, accessible code.
Share and learn. There's no single correct solution.
Have fun. Skip days if needed, combine prompts, or create your own.
Participants
All these folks have taken part.