Component-Driven UI
Component-Driven UI belongs to the World Wide Web from the 1990s to current browser platforms. This entry focuses on the concrete visual and technical features that define the subject, then connects those features to later design practice without pretending every historical object is a modern design system.
- semantic structure
- responsive layout
- interaction states
- accessibility and performance
What makes the subject recognizable
Web design is where centuries of visual systems meet a live runtime: typography, grid, color and motion must adapt to content, device and user preferences.
What the work is made with
These materials are not decoration added after the idea. Their weight, stiffness, opacity, manufacturing method or reproducibility help determine what forms are practical.
People and works to connect
Use these names as research anchors rather than a closed canon. The wider context includes workshops, manufacturers, patrons, collaborators and regional variants that a short reference page cannot exhaust.
How the visual system is built
Responsive component width
Shrink the component and watch its internal relationship change. Modern interface systems are not fixed posters; they negotiate the space they receive.
Historical contribution
Component-Driven UI belongs to the World Wide Web from the 1990s to current browser platforms. This entry focuses on the concrete visual and technical features that define the subject, then connects those features to later design practice without pretending every historical object is a modern design system.
Web design is where centuries of visual systems meet a live runtime: typography, grid, color and motion must adapt to content, device and user preferences.
Component-Driven UI in its actual setting
Component-Driven UI belongs to the World Wide Web from the 1990s to current browser platforms. This entry focuses on the concrete visual and technical features that define the subject, then connects those features to later design practice without pretending every historical object is a modern design system.
The relevant context is the World Wide Web from the 1990s to current browser platforms. Within that setting, the most useful features to compare are semantic structure, responsive layout, interaction states and accessibility and performance. Those characteristics are concrete enough to test against real examples, which is more useful than reducing the subject to a vague mood or a generic set of design words.
What was made, and how
The working vocabulary includes HTML, CSS, JavaScript where needed, design tokens and browser APIs. These materials and tools matter because they constrain the kinds of edges, surfaces, joints, color, scale or repetition that can be produced. The page’s process sequence is structure content, style progressively, componentize, add state / motion, test accessibility and measure performance / support.
Reading the process in order helps separate technique from appearance. A feature that comes directly from the material should not be described as if it were arbitrary ornament, and an intentional formal decision should not be dismissed as an accident of the tool.
What to look at next
Useful anchors include standards bodies, browser teams and web practitioners depend on topic. They give the subject names, works, schools, systems or implementations that can be checked independently. Comparing several anchors matters because one famous object rarely represents every phase or regional version of a movement, technique or tool.
Component-Driven UI belongs to the World Wide Web from the 1990s to current browser platforms. This entry focuses on the concrete visual and technical features that define the subject, then connects those features to later design practice without pretending every historical object is a modern design system.
Carry the rule forward
The CSS below does not costume the page as “historical.” It translates one structural idea, proportion, repeated line, responsive hierarchy, material edge or tokenized reuse, into a browser-native rule.
.card { container-type: inline-size; }
@container (width < 34rem) {
.card__layout { grid-template-columns: 1fr; }
}01 What to compare
Compare several examples rather than one iconic image. Look for which characteristics remain stable and which change with scale, patron, material, manufacturer, workshop or later phase.
That comparison prevents a movement or artist from collapsing into a single Pinterest-style mood board.
02 Material and reproduction
The subject becomes easier to understand when its physical production and reproduction are separated. An original object, a printed photograph of it and a responsive web image each impose different scale, crop, surface and color behavior.
That is why the page shows process and tools next to formal traits instead of describing style only with adjectives.
03 Wemaxa design bridge
Web design is where centuries of visual systems meet a live runtime: typography, grid, color and motion must adapt to content, device and user preferences.
For Wemaxa, the useful endpoint is a responsive system: typography, layout, components, motion and states should express a coherent rule and still work with real content.
Component-Driven UI: the design principle worth keeping
Web design is where centuries of visual systems meet a live runtime: typography, grid, color and motion must adapt to content, device and user preferences.