Scott and Wes explore UI Components, discussing functionality, styling, accessibility, and theming. From headless components to styled starters, they share valuable insights to elevate your UI game.

Show Notes * 00:00 Welcome to Syntax! * 02:39 We’re on YouTube. * 03:14 The four categories of UI libraries or frameworks. * 03:46 What does a UI component need to do? + 04:14 Must be functional. + 06:20 They must fit styling. + 06:33 They must be accessible. + 08:09 “Internationalizationable.” + 09:29 They must handle theming and variants. * 10:05 A few common UI components. + 10:14 Date Pickers. + 12:10 Dropdowns. + 13:21 Toast message. + Svelte French Toast + 15:11 Some honorable mentions. * 16:10 Headless components. + 18:54 React Aria. + Behavior, Accessibility, Internationalization + 19:34 Radix UI Primitives. + 20:16 Downshift JS. + 21:29 Tanstack Table and Forms. * 26:00 Unstyled components. + 28:04 Shoelace. + 32:47 React Aria Components. + 33:00 Headless UI. + 33:04 Radix UI. + 37:12 Base UI. * 38:23 What’s up with Google’s design? * 40:22 Styled Starters. + React Aria Components Starter + ShadCN + Tailwind Catalyst + MeltUI * 47:50 What is the process for overriding with custom elements. * 51:10 UI Kits and Design Systems. * 53:06 Some things to consider. * JS Nation * 55:41 A few more options to consider. + Pigment CSS + Base UI + Shoelace + BaseLayer + JollyUI + DraftUI + Radix UI + PenguinUI + Tailwind CSS + TailwindUI + VerveUI + DaisyUI + ChakraUI + Flowbite + FloatingUI + Downshift JS + Mantine * 59:02 Sick Picks & Shameless Plugs.

Sick Picks * Wes: Battery Daddy * Scott: Lazy Susan, Rechargeable Batteries, Charger

Shameless Plugs * Scott: Syntax on YouTube

Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads

Wes: X Instagram Tiktok LinkedIn Threads

Scott:X Instagram Tiktok LinkedIn Threads

Randy: X Instagram YouTube Threads