Home
PATTTTERNS - An open catalog of design patterns | Product Hunt

Made with šŸ’™ by Pablo Armenv2.1.10

Home
/Flows
/Accessibility & Personalization
Description
Great products should fit for every person.

Patterns for Accessibility & Personalization

Because great products should fit for every person. Good interfaces allows people adjust the experience for different physical or cognitive requirements.
Ā 
Recommendation (Ad)
https://uink.digital
Ā 
  • Desktop (69)
  • Tablet (1)
  • Mobile (14)
389. Text Edit Inline Input

389. Text Edit Inline Input

Desktop, Accessibility, Decision Making, Web, English, Text Input, Hypertext Links, Modal

Open pattern
388. Multiple Item Selection Drag & Drop

388. Multiple Item Selection Drag & Drop

Desktop, Accessibility, Feedback, Awareness, Decision Making, Web, EspaƱol, User Selection, Drag & Drop Gesture, Tooltip, Scrollbar, Checkbox

Open pattern
379. Dropdown Filters

379. Dropdown Filters

Desktop, Pathfinding, Accessibility, Web, EspaƱol, Filters

Open pattern
360. Page Outline Menu

360. Page Outline Menu

Desktop, Pathfinding, Awareness, Accessibility, Onboarding, Web, English, Pagination, Anchor Scroll

Open pattern
362. Modal Blackout with Form & Animations

362. Modal Blackout with Form & Animations

Desktop, Accessibility, Apple OS, EspaƱol, Modal, Text Input, Transition

Open pattern
349. HubSpot - Toggle High Contrast

349. HubSpot - Toggle High Contrast

Desktop, Accessibility, Awareness, Web, English, Hypertext Links, Navbar

Open pattern
359. Toggle List/Grid View

359. Toggle List/Grid View

Desktop, Accessibility, Onboarding, Pathfinding, Web, EspaƱol, Tooltip, Hypertext Links

Open pattern
347. YouTube - Floating Progress Bar

347. YouTube - Floating Progress Bar

Desktop, Awareness, Accessibility, Feedback, Web, English, Side Panel, Accordion

Open pattern
342. Savee - Light/Dark Mode Switcher

342. Savee - Light/Dark Mode Switcher

Desktop, Accessibility, Pathfinding, Web, English, Checkbox, Tabs

Open pattern
341. Image Grid Customization Sliders

341. Image Grid Customization Sliders

Desktop, Accessibility, Pathfinding, Web, English, Animation, Drag & Drop Gesture, Range Field

Open pattern
340. Asana - Zoom/Magnifier Over Image

340. Asana - Zoom/Magnifier Over Image

Desktop, Accessibility, Pathfinding, Web, English, Animation

Open pattern
346. Toggl - Sidebar Menu Show More

346. Toggl - Sidebar Menu Show More

Desktop, Pathfinding, Accessibility, Awareness, Web, English, Accordion, Navbar

Open pattern
345. Vertical Accordion for FAQs

345. Vertical Accordion for FAQs

Desktop, Pathfinding, Accessibility, Awareness, Web, EspaƱol, Accordion, Hypertext Links

Open pattern
343. Modal Drag & Drop to Fixed Position

343. Modal Drag & Drop to Fixed Position

Desktop, Accessibility, Pathfinding, Awareness, Web, EspaƱol, Drag & Drop Gesture, Modal, Side Panel

Open pattern
332. Apple - Drag&Drop Browser File to Desktop

332. Apple - Drag&Drop Browser File to Desktop

Desktop, Pathfinding, Accessibility, Awareness, Web, Drag & Drop Gesture, Image / Illustration, File OS, Modal, Click Event

Open pattern
330. PositivePsychology - Article User Feedback

330. PositivePsychology - Article User Feedback

Desktop, Accessibility, Feedback, Web, English

Open pattern
325. Apple - Drag & Drop Slots

325. Apple - Drag & Drop Slots

Desktop, Decision Making, Awareness, Accessibility, Apple OS, English

Open pattern
315. Signal - PIN Reminder

315. Signal - PIN Reminder

Desktop, Awareness, Accessibility, Apple OS, English, Text Input, Modal, Banner, Hypertext Links

Open pattern
312. Pocket - View Switcher

312. Pocket - View Switcher

Desktop, Pathfinding, Accessibility, Web, EspaƱol, Navbar, Thumbnail, Toggle Field, Radio Button

Open pattern
306. Drag & Drop for Reordering Items

306. Drag & Drop for Reordering Items

Desktop, Awareness, Accessibility, Web, English, Drag & Drop Gesture, Filters, Notion

Open pattern
302. Theme Switcher in Side-drawer

302. Theme Switcher in Side-drawer

Desktop, Accessibility, Pathfinding, Web, EspaƱol, Side Panel, Transition, Image / Illustration, Click Event, Google

Open pattern
293. Collapsable Sidebar Menu

293. Collapsable Sidebar Menu

Desktop, Awareness, Pathfinding, Accessibility, Web, English, EspaƱol, Side Panel, Transition, Click Event, Navbar, Google, Gmail

Open pattern
288. Vimeo - Topbar Language Switching

288. Vimeo - Topbar Language Switching

Desktop, Awareness, Accessibility, Web, English, EspaƱol, Vimeo

Open pattern
282. Telegram - Chat Setup Wizard

282. Telegram - Chat Setup Wizard

Desktop, Onboarding, Accessibility, Pathfinding, Apple OS, English, Telegram

Open pattern
280. Slack - Workspace Creation Wizard

280. Slack - Workspace Creation Wizard

Desktop, Accessibility, Onboarding, Apple OS, EspaƱol, Slack

Open pattern
271. Slack - Collapsable Sidebars

271. Slack - Collapsable Sidebars

Desktop, Pathfinding, Accessibility, Apple OS, EspaƱol, Slack

Open pattern
278. Search Menu Dropdown from Input Text

278. Search Menu Dropdown from Input Text

Desktop, Pathfinding, Accessibility, Web, English, Google, Google Analytics

Open pattern
277. Horizontal Card Slider with Actions

277. Horizontal Card Slider with Actions

Desktop, Pathfinding, Accessibility, Web, EspaƱol, Linkedin

Open pattern
265. Youtube - Hidden Options Menu (Dots)

265. Youtube - Hidden Options Menu (Dots)

Desktop, Pathfinding, Accessibility, Web, English, YouTube, Google

Open pattern
258. Squarespace - Adaptable Viewport Size

258. Squarespace - Adaptable Viewport Size

Desktop, Accessibility, Pathfinding, Web, English, Side Panel, Hypertext Links, Animation, Squarespace

Open pattern
256. Modal Blackout with Steps & Forms

256. Modal Blackout with Steps & Forms

Desktop, Onboarding, Decision Making, Accessibility, Web, EspaƱol, Facebook

Open pattern
243. GIPHY - Trim Video Slicers

243. GIPHY - Trim Video Slicers

Desktop, Decision Making, Awareness, Accessibility, Web, English, Animation, User Selection, Drag & Drop Gesture, GIPHY

Open pattern
254. Notion - Side Menu Toggle

254. Notion - Side Menu Toggle

Desktop, Pathfinding, Accessibility, Web, English, EspaƱol, Notion

Open pattern
253. Youtube - Table Row Selector

253. Youtube - Table Row Selector

Desktop, Accessibility, Pathfinding, Awareness, Web, English, User Selection, Text Input, Fixed on Scroll, Thumbnail, YouTube, Google

Open pattern
228. Notification Bell Status

228. Notification Bell Status

Desktop, Accessibility, Web, English, Hypertext Links, Dropdown Menu, Empty State, User Selection, Avatar, Animation, YouTube, Google

Open pattern
236. Horizontal Graph with Time Ranges

236. Horizontal Graph with Time Ranges

Desktop, Pathfinding, Accessibility, Web, English, Google, Google Analytics

Open pattern
226. Youtube Studio - Image Multi-zone Crop

226. Youtube Studio - Image Multi-zone Crop

Desktop, Accessibility, Web, EspaƱol, YouTube, Google

Open pattern
225. Cloudflare - Multiple Graphs by Time Ranges

225. Cloudflare - Multiple Graphs by Time Ranges

Desktop, Pathfinding, Accessibility, Web, English, Cloudflare

Open pattern
222. Cloudflare - Toggle Light/Dark Theme

222. Cloudflare - Toggle Light/Dark Theme

Desktop, Accessibility, Web, English, Cloudflare

Open pattern
220. Apple - Multi-window App

220. Apple - Multi-window App

Desktop, Accessibility, Pathfinding, Apple OS, EspaƱol, Apple, Apple Notes

Open pattern
219. Apple - Adjacent Sidebar Toggle

219. Apple - Adjacent Sidebar Toggle

Desktop, Tablet, Accessibility, Pathfinding, Apple OS, EspaƱol, Apple, Apple Notes

Open pattern
218. Apple Keynote - Template Format Selection

218. Apple Keynote - Template Format Selection

Desktop, Decision Making, Accessibility, Apple OS, EspaƱol, Apple, Apple Keynote

Open pattern
214. Netflix - Information Toggle

214. Netflix - Information Toggle

Desktop, Accessibility, Web, EspaƱol, Dropdown Menu, Video, Thumbnail, Navbar, Button, Toggle Field, Netflix

Open pattern
183. Apple MacOS - Full Screen Widget Customization

183. Apple MacOS - Full Screen Widget Customization

Desktop, Accessibility, Apple OS, Apple

Open pattern
54. Apple Safari - Browser Reader Mode

54. Apple Safari - Browser Reader Mode

Desktop, Accessibility, Apple OS, Web, Apple, Apple Safari

Open pattern
134. Save for Reading Later

134. Save for Reading Later

Desktop, Mobile, Accessibility, Web, English

Open pattern
138. Read Modes

138. Read Modes

Desktop, Accessibility, Web, EspaƱol

Open pattern
91. Settings for Account Privacy

91. Settings for Account Privacy

Desktop, Accessibility, Web, English, Twitter

Open pattern
189. Feature Preview on Menu

189. Feature Preview on Menu

Desktop, Awareness, Accessibility, Web, English, Dropdown Menu, Notification Badge

Open pattern
7. sitepoint - Accessibility Adjustments

7. sitepoint - Accessibility Adjustments

Desktop, Accessibility, Web, English

Open pattern
157. Webflow - Magnifying Glass on Images

157. Webflow - Magnifying Glass on Images

Desktop, Accessibility, Web, English, Webflow

Open pattern
11. Apple MacOS - Split OS Screens

11. Apple MacOS - Split OS Screens

Desktop, Accessibility, Web

Open pattern
167. Apple MacOS - 2-pane Widget Customization

167. Apple MacOS - 2-pane Widget Customization

Desktop, Accessibility, Apple OS, English, Apple

Open pattern
182. Static Tooltip for Text Formatting

182. Static Tooltip for Text Formatting

Desktop, Accessibility, Web, English, Google, Google Sites

Open pattern
29. About.me - Wizard Generation Profile

29. About.me - Wizard Generation Profile

Desktop, Onboarding, Accessibility, Web, English

Open pattern
186. Apple Safari - Browser Background Customization

186. Apple Safari - Browser Background Customization

Desktop, Accessibility, Apple OS, EspaƱol, Apple, Apple Safari

Open pattern
176. Wordpress.com - Natural Inputs with Suggestions

176. Wordpress.com - Natural Inputs with Suggestions

Desktop, Decision Making, Accessibility, Awareness, Pathfinding, Web, English, Wordpress

Open pattern
129. PDF Show & Download

129. PDF Show & Download

Desktop, Accessibility, Decision Making, Web, English

Open pattern
86. Table Column Slicer

86. Table Column Slicer

Desktop, Accessibility, Decision Making, Web, English

Open pattern
202. Apple Reminders - List Widget Customization

202. Apple Reminders - List Widget Customization

Desktop, Accessibility, Apple OS, EspaƱol

Open pattern
57. IDF - Encouraging Newsletter Sign-up

57. IDF - Encouraging Newsletter Sign-up

Desktop, Decision Making, Accessibility, Web, English

Open pattern
24. Window Maximize Options

24. Window Maximize Options

Desktop, Accessibility, Web, English

Open pattern
119. PrestaShop - Site Cookie Management

119. PrestaShop - Site Cookie Management

Desktop, Accessibility, Consent, Web, EspaƱol

Open pattern
54. Modal for Language & Region Picker

54. Modal for Language & Region Picker

Desktop, Accessibility, Web, English, Google

Open pattern
156. Figma - Keyboard Navigated Menu

156. Figma - Keyboard Navigated Menu

Desktop, Pathfinding, Accessibility, Windows, Apple OS, Web, English, View, Original source on Twitter, Figma

Open pattern
21. Apple MacOS - Advanced Color Picking

21. Apple MacOS - Advanced Color Picking

Desktop, Accessibility, Apple OS, English

Open pattern
42. Modal for Tags Editing

42. Modal for Tags Editing

Desktop, Accessibility, Awareness, Web, English, Google, Google Keep

Open pattern
160. Pocket - Content Highlighting

160. Pocket - Content Highlighting

Desktop, Accessibility, Pathfinding, Web, EspaƱol

Open pattern
188. Trello - Color shapes for Colour-blind

188. Trello - Color shapes for Colour-blind

Desktop, Accessibility, Web, EspaƱol, Modal, Tooltip, Hypertext Links, Text Input, Trello

Open pattern
Ā 
Ā 
Ā