Reverse-engineering Stripe's themes with CSS custom props

Coder Coder ยท Beginner ยท๐Ÿ–Œ๏ธ UI/UX Design ยท2y ago
๐Ÿ”ฅ My course: Responsive Design for Beginners! https://coder-coder.com/responsive/ ๐Ÿ’ป Become a full-stack web dev with Zero to Mastery: https://academy.zerotomastery.io/a/aff_338z7xnj/external?affcode=441520_ti97uk6b In this video I'll show you how to use CSS custom properties to create style themes that you can add to elements by just adding a CSS class. I found this approach on the Stripe website and am using a simple version for these blocks. Thanks to @juxtopposed for Realtime Colors which I used to generate my theme colors! 0:00 - Intro 0:28 - Inspecting the Stripe website 9:30 - Faโ€ฆ
Watch on YouTube โ†— (saves to browser)

Chapters (6)

Intro
0:28 Inspecting the Stripe website
9:30 Fast forward designing the mockup
9:46 Building out the blocks
14:00 Adding basic styles
29:51 Adding theme styles
My favorite resources and tools for coding
Next Up
My favorite resources and tools for coding
Coder Coder