UI Components
Four Elements of Mobile-Friendly Responsive Menus
Build a responsive menu that works on touch and keyboard: a real button toggle, details submenus, CSS-only animation and a dialog off-canvas…
Tag: navigation
UI Components
CSS Dropdown Menu: A Modern, Accessible Multi-Level Menu
Build a two-level dropdown menu with modern CSS and about 25 lines of JavaScript, using disclosure buttons, aria-expanded and focus-visible so it…
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…
Design
Single-Page Portfolio Sites: 8 Examples and How to Build One
Eight live single-page portfolios worth studying, and the structure, CSS scrolling and navigation patterns that make a one-page site work.
UI Components
Advanced CSS Menu: Free-Positioned Links with Modern CSS
Rebuild the classic image-based advanced CSS menu with real text, custom-property coordinates, container queries, matching keyboard states and anchor-positioned captions.
CSS & HTML
Design a Watercolor Effect Menu With CSS and SVG Filters
Recreate the hand-painted watercolor menu in pure CSS: a torn paper card, handwritten links and a bleeding wash on hover, built with…