Convert Figma Design into Elementor Using Container & Flexbox Features

Hey guys, welcome to another new complete project.

In this video, I’ll show you how to convert this beautiful agency website from Figma to Elementor using Container & Flexbox features. And I’ll go through it step by step.

After completing this video, you will have a solid knowledge of the Elementor container and how the flexbox works on a real project.

If you are unfamiliar with the elementor container flexbox, I highly recommend you watch this video to understand exactly how the flexbox works. And also, for creating this tutorial, I’ll be using the Kadence WordPress theme, which is completely free.

Please note that: This tutorial is only for beginners. 

You can also change the video speed from here. Just simply click on this gear icon, and you can slow down or speed up the video if you feel I’m going very slow or fast. 

So, without further delay, let’s jump into my computer. 

Custom CSS:

.c-1 span.elementor-counter-number-suffix {
    color: #FAC641;
}

.c-2 span.elementor-counter-number-suffix {
    color: #8C54FF;
}

.c-3 span.elementor-counter-number-suffix {
    color: #FDDD4A;
}

.c-4 span.elementor-counter-number-suffix {
    color: #8C54FF;
}

.c-toggle .elementor-toggle-item .elementor-tab-title {
    border-radius: 10px;
}

.c-toggle .elementor-toggle-item .elementor-tab-content {
    margin-top: -9px;
}

.eael-grid-post-excerpt a {display: inline-block;}

.eael-entry-media {
    border-radius: 10px;
}