If you haven’t yet got to grips with the Figma interface design application, now’s your chance. In our new course, Figma to HTML: Code Up a Single-Page Design, you’ll master Figma by going through the process of converting a Figma website design to HTML.
What You’ll Learn
In this course, Kezz Bracey will show you how to take a one-page design for a travel website in Figma and convert it into HTML.
In the process, you’ll learn some tricks about working with Figma and using CSS Grid and Flexbox to make layout control a breeze.
Here are some free lessons from this course, as a preview of what you can expect:
Create the Basic Shell
In this video, you’ll see how to create the basic shell of your site. You’ll create the required documents, add basic HTML, link in your stylesheet, and load the fonts you’ll need. The last element of the groundwork is to set up some base layout classes you’ll use throughout the content of the site.
Create the Top Header
In this video, you’ll start coding up the content of the site, beginning with the three headers that comprise the upper portion of the page.
Create the Tours Section Grid
In this later video from the course, you’ll start building the main content sections of the site. You’ll start by laying out the content of the “Tours” section using CSS Grid.
Take the Course
You can take our new course straight away with a subscription to Envato Elements. For a single low monthly fee, you get access not only to this course, but also to our growing library of over 1,000 video courses and industry-leading eBooks on Envato Tuts+.
Plus you can download unlimited items from the huge Envato Elements library of over a million creative assets. Create with unique fonts, photos, graphics and templates, and deliver better projects faster.