Thread by @vponamariov

How to design almost any UI element.

A curated list of 58 articles 👇

Buttons.

7 Basic Rules for Button Design by @101babich
uxplanet.org/7-basic-rules-…

Button Design
uxdesign.cc/button-design-…

Cheatsheet for buttons by @TessGadd
uxdesign.cc/ui-cheat-sheet…

Text fields.

UI cheat sheet: text fields (Awesome article! 🤩)
uxdesign.cc/ui-cheat-sheet…

Text fields & Forms design — UI components series
uxdesign.cc/text-fields-fo…

The Anatomy of Input Field
uxplanet.org/the-anatomy-of…

Checkboxes & Toggles.

Checkbox vs Toggle Switch by @uxplanet
uxplanet.org/checkbox-vs-to…

Toggle-Switch Guidelines by @NNgroup
nngroup.com/articles/toggl…

Toggle design patterns from @just_in_mind
justinmind.com/blog/toggle-de…

38 Checkbox Designs 😳
uicookies.com/css-checkbox/

Radio Buttons.

Selection controls — UI component series (AWESOME 🤩)
uxdesign.cc/selection-cont…

Radio Buttons UX Design
uxplanet.org/radio-buttons-…

Radio button design: easy selection and decision-making
justinmind.com/blog/radio-but…

Tables.

Design better data tables by @CoyleAndrew (😍)
medium.com/nextux/design-…

The Ultimate Guide to Designing Data Tables
medium.com/design-with-fi…

Designing better data tables for enterprise UX
uxdesign.cc/data-table-for…

Datepickers. (It's a pain 😣)

How to Design a Perfect Date Picker Control?
uxplanet.org/how-to-design-…

Date Picker Design Best Practices
uxplanet.org/date-picker-de…

A hunt for the perfect date picker UI
uxdesign.cc/date-picker-de…

Sliders.

UNBELIEVABLE article. @smashingmag is a golden resource really.
smashingmagazine.com/2017/07/design…

Slider design UI patterns and examples from @just_in_mind
justinmind.com/blog/slider-de…

Slider Design: Rules of Thumb from NNGroup
nngroup.com/articles/gui-s…

Tabs.

Module Tabs in Web Design: Best Practices and Solutions
smashingmagazine.com/2009/06/module…

12 Tabs Design guidelines
nngroup.com/articles/tabs-…

Dropdowns

UI cheat sheet: dropdown field (Like this one 🥰)
uxdesign.cc/ui-cheat-sheet…

Dropdowns: Design Guidelines
nngroup.com/articles/drop-…

Drop down list design: the complete guide
justinmind.com/blog/drop-down…

Pagination

Paging, Scrolling, and Infinite Scroll by @uxmatters
uxmatters.com/mt/archives/20…

UX: Infinite Scrolling vs. Pagination by @101babich
uxplanet.org/ux-infinite-sc…

Users' Pagination Preferences and "View All"
nngroup.com/articles/item-…

Search inputs

Best UX practices for search inputs
uxdesign.cc/best-ux-practi…

Design a Perfect Search Box
uxplanet.org/design-a-perfe…

Site Search Suggestions by @NNgroup
nngroup.com/articles/site-…

Breadcrumbs.

Breadcrumbs: 11 Design Guidelines for Desktop and Mobile
nngroup.com/articles/bread…

Are breadcrumbs still fresh for UX?
medium.com/madison-ave-co…

Breadcrumb examples for inspiration
justinmind.com/blog/breadcrum…

Carousels.

Carousel/slider design best practices (with examples) by @webflow
webflow.com/blog/carousel-…

Carousel Usability: Designing an Effective UI for Websites with Content Overload
nngroup.com/articles/desig…

Designing a User-Friendly Homepage Carousel
uxplanet.org/designing-a-us…

Modals.

Best Practices for Designing UI Overlays by @oliverlindberg
xd.adobe.com/ideas/process/…

appcues.com/blog/modal-dia… from @Appcues

Modal & Nonmodal Dialogs: When (& When Not) to Use Them
nngroup.com/articles/modal…

Modal dialogs
medium.com/pulsar/modern-…

Cards.

Card UI design: fundamentals and examples
justinmind.com/blog/cards-ui-…

Simple Design Tips for Crafting Better UI Cards
uxplanet.org/simple-design-…

Designing cards
uxdesign.cc/designing-card…

Tooltips.

Tooltip Guidelines
nngroup.com/articles/toolt…

Designing Better Tooltips For Mobile User Interfaces
smashingmagazine.com/2021/02/design…

Tooltips: your secret weapon for improving feature discovery by @Sofiaqt

uxdesign.cc/tooltips-your-…

Navigation.

Navigation design: Almost everything you need to know
justinmind.com/blog/navigatio…

UX Design for Navigation Menu from @Prototypr
blog.prototypr.io/ux-design-for-…

The Fastest Navigation Layout for a Three-Level Menu from @uxmovement
uxmovement.medium.com/the-fastest-na…

Loaders.

Progress Indicators Make a Slow System Less Insufferable
nngroup.com/articles/progr…

Stop Using A Loading Spinner, There’s Something Better
uxdesign.cc/stop-using-a-l…

Best Practices For Animated Progress Indicators
smashingmagazine.com/2016/12/best-p…

Forms.

Design Better Forms by @CoyleAndrew (Really good read! 😍)
medium.com/nextux/design-…

Form Design: 13 Empirically Backed Best Practices by @iamalexbirkett
cxl.com/blog/form-desi…

The UX behind designing better forms by @CharmieKapoor
uxdesign.cc/the-ux-behind-…

If you want to have it as a single list instead of a thread, check out Reddit's first comment:

reddit.com/r/webdev/comme…

Let me add one more resource:

user-interface.io

Once a week, I send a newsletter covering different UI/UX topics. Everything related to user interfaces.

No ads, no spam.

Soon will start a blog there because it's not very convenient to post a lot of info in threads.