Reverse-engineering Stripe's themes with CSS custom props

🔥 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 - Fast forward designing the mockup
9:46 - Building out the blocks
14:00 - Adding basic styles
29:51 - Adding theme styles

____________________________
SUPPORT THE CHANNEL
⭐ Join channel members and get perks: https://www.youtube.com/channel/UCzNf0liwUzMN6_pixbQlMhQ/join
👏🏽 Hit the THANKS button in any video!
🎨 Get my VS Code theme: https://marketplace.visualstudio.com/items?itemName=CoderCoder.codercoder-dark-theme
WANT TO LEARN WEB DEV?
Check out my courses:
🌟 Responsive Design for Beginners: https://coder-coder.com/responsive/
🌟 Gulp for Beginners: https://coder-coder.com/gulp-course/
RECOMMENDATIONS
⌨ My keyboard, Vissles V84 -- https://vissles.com/?ref=mu96kxst5w -- 🔥 get 10% off with code THECODERCODER --
💻 Other gear -- https://www.amazon.com/shop/thecodercoder?listId=1LMCKGUTMVYXD
📚 My Favorite Books -- https://coder-coder.com/best-web-development-books/
📺 My Favorite Courses -- https://coder-coder.com/best-web-development-courses/
🔽 FOLLOW CODER CODER
Blog -- https://coder-coder.com/
Twitter -- https://twitter.com/thecodercoder
Instagram -- https://www.instagram.com/thecodercoder
#css #webdevelopment

Видео Reverse-engineering Stripe's themes with CSS custom props канала Coder Coder