In this video I go over how to create this Figma design using only HTML and CSS. I show you the full front end coding tutorial, where I create the structure of the elements in HTML and then write all of the styling and effects with CSS. I show you how I use the Figma design as a guide to create all of the elements and how I use Flexbox for the responsive layout. I also explain how to use pseudo elements for the step counter.

Codepen: https://codepen.io/angeladelise/pen/KKVwLWr

In this video I show you:

• 0:51 - Figma Design
• 2:06 - HTML Code
• 4:08 - Container HTML Code
• 4:58 - CSS Code
• 6:07 - Container CSS Code
• 7:57 - Counter CSS Code
• 8:12 - ::Before Explained
• 9:16 - Counter with Counter-Increment
• 11:35 - Responsive Flexbox
• 13:06 - Code Review

#css #html #figma