Select it! Styling new HTML UI capabilities
summary
Customizable selects are usable today by opting in with appearance: base-select (Chromium only) and they expose pseudo elements like picker-icon and picker-select, a cloned selected-content, and CSS hooks such as starting-style and transition-behavior for smooth entry/exit. Demos use the anchoring API, scroll snapping, sibling-index/count math, interpolate-size and sticky-position to build radial, carousel and emoji pickers that keep keyboard nav and most screen‑reader behavior; some features remain behind flags (Chrome Canary) and a Firefox transition bug exists.
AI-written summary · about
chapters (9)
- 0:00Introduction
- 5:20Meet the speaker
- 7:49OpenUI and web standards
- 9:57Browser’s top layer
- 15:40Styling selects with CSS
- 24:29Customizable selects experiments
- 33:22Accessibility experiments
- 40:46OpenUI future and sliders
- 42:50Call to action
