UI Components
Build an Accessible Lightbox with the Dialog Element
Skip the jQuery plugin. A native dialog gives you the backdrop, focus handling and Escape key, and a few lines of CSS…
Topic
UI Components
Menus, forms, galleries, dialogs and buttons, built accessible from the start.
UI Components
HTML Placeholder Text: Styling, Floating Labels and Accessibility
The placeholder attribute works everywhere now, so drop Modernizr and jQuery. Style it, build a CSS-only floating label, and keep forms accessible.
UI Components
Modern Website Footer and Sitemap Design
The footer has replaced the sitemap page for most sites. See how Apple, GitHub, GOV.UK and Mozilla organise theirs, then build a…
UI Components
Build an Interactive SVG World Map with CSS and JavaScript
Create an interactive world map with inline SVG, CSS color-mix() and about 40 lines of vanilla JavaScript: tooltips, keyboard support and data…
UI Components
CSS Expandable Box: Fluid Cards That Grow With Their Content
The classic all-expandable box rebuilt with modern CSS: em-based sizing, shadows, native resize and border-image frames, with no extra markup or sliced…
UI Components
CSS Social Buttons: Accessible Share and Follow Buttons
Build one reusable social button component with inline SVG icons, custom properties and color-mix(), then add copy-link and native share behaviour with…
Free snippets: UI Components
Copy-ready Bootstrap components with live preview, MIT licensed.
