In this video I'll show you how to code a recipe card with HTML and CSS. At any time you can download the original design file for free and use it in your own projects, as well as the code we'll be writing in this video.
Figma is a great design software that you can use for designing websites, mobile apps, icons and even small components like the one in this video.
For the coding, I used Visual Studio Code and got fancy in some places with CSS variables and Flexbox.
Download the Figma design file for free: https://www.figma.com/file/vBs96BOSWt...
Get the code from CodePen here: https://codepen.io/adipurdila/pen/MWb...
Links mentioned in this video:
Unsplash photo: https://unsplash.com/photos/Mzy-OjtCI70
How to Design a Recipe Card in Figma + FREE File Download: • How to Design a Recipe Card in Figma ...
Poppins Font: https://fonts.google.com/specimen/Pop...
Shadows app: https://brumm.af/shadows
object-fit on MDN: https://developer.mozilla.org/en-US/d...
See all my Skillshare classes here: https://www.skillshare.com/r/user/adi...
You can get 14 FREE days of a Skillshare Premium Membership through the link above. I also get a small commision (referral link).
Let's connect on social media:
Twitter: / adipurdila
Dribbble: https://dribbble.com/adipurdila
Facebook: / adipurdila
Instagram: /
You’re watching: How to Code a Recipe Card with HTML and CSS
Music: Envato Elements
Смотрите видео How to Code a Recipe Card with HTML and CSS + FREE File Download онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Adi Purdila 01 Январь 1970, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 4,39 раз и оно понравилось 8 людям.