Skip to content

🧩 Collection of UX patterns for everyone but specially towards developers who want to understand how to build effective UI components accessible and usable.

License

Notifications You must be signed in to change notification settings

thedaviddias/ux-patterns-for-developers

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

60 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

UX Patterns for Devs

UX Patterns for Developers is a free collection of UX patterns towards developers who want to understand how to build effective UI components accessible and usable.

Screenshot of the homepage ofUX Patterns for Devs

Note

This project is a work in progress. New content and updates should be expected regularly.

🧩 Patterns

This is an updated list of available and incoming patterns.

Content Management

  • Accordion (coming soon)
  • Carousel (coming soon)
  • Drag And Drop (coming soon)
  • Modal (coming soon)
  • Tooltip (coming soon)

Forms

  • Autocomplete
  • Button
  • Checkbox (coming soon)
  • Code Confirmation (coming soon)
  • Color Picker (coming soon)
  • Currency Input (coming soon)
  • Date Input (coming soon)
  • Date Picker (coming soon)
  • Date Range (coming soon)
  • File Input (coming soon)
  • Form Validation (coming soon)
  • Multi Select Input (coming soon)
  • Password (coming soon)
  • Phone Number (coming soon)
  • Radio (coming soon)
  • Rating Input (coming soon)
  • Rich Text Editor (coming soon)
  • Search Field (coming soon)
  • Selection Input (coming soon)
  • Signature Pad (coming soon)
  • Slider (coming soon)
  • Tag Input (coming soon)
  • Text Field (coming soon)
  • Time Input (coming soon)
  • Toggle (coming soon)

Navigation

  • Back To Top
  • Breadcrumb
  • Hambuger Menu (coming soon)
  • Infinite Scroll
  • Megamenu (coming soon)
  • Navigation Menu (coming soon)
  • Pagination (coming soon)
  • Sidebar (coming soon)
  • Tabs (coming soon)

User Feedback

  • Cookie Consent (coming soon)
  • Empty States (coming soon)
  • Loading Indicator (coming soon)
  • Notification (coming soon)
  • Progress Indicator (coming soon)
  • Skeleton (coming soon)

Getting Started

To start the project locally, run:

pnpm run dev

Generate new pattern

This command will generate a new pattern template. Simply specify the language, the category and the name of the pattern starting with a capital letter.

pnpm run generate

✨ Contributors

You are welcome to contribute to this project! Please read the CONTRIBUTING.

License

MIT © David Dias

About

🧩 Collection of UX patterns for everyone but specially towards developers who want to understand how to build effective UI components accessible and usable.

Topics

Resources

License

Code of conduct

Security policy

Stars

Watchers

Forks

Sponsor this project