Animated Feature Section

Now paste(CTRL +V) the content into a Custom HTML block and then click “Convert to Blocks”

Best with:‎

Twentig

<!-- wp:cover {"url":"https://dreamy-smakager-a34377.netlify.app/wp-content/uploads/2024/05/luke-chesser-rCOWMC8qf8A-unsplash-1.jpg","id":8,"hasParallax":true,"isRepeated":true,"isUserOverlayColor":true,"focalPoint":{"x":0.71,"y":0.48},"customGradient":"linear-gradient(135deg,rgba(75,235,221,0) 0%,rgba(1,1,1,0) 33%,rgb(0,0,0) 44%,rgb(0,0,0) 60%,rgb(0,0,0) 80%,rgb(0,0,0) 100%)","align":"full","style":{"spacing":{"padding":{"top":"0"}}}} -->
<div class="wp-block-cover alignfull has-parallax is-repeated" style="padding-top:0"><span aria-hidden="true" class="wp-block-cover__background has-background-dim-100 has-background-dim wp-block-cover__gradient-background has-background-gradient" style="background:linear-gradient(135deg,rgba(75,235,221,0) 0%,rgba(1,1,1,0) 33%,rgb(0,0,0) 44%,rgb(0,0,0) 60%,rgb(0,0,0) 80%,rgb(0,0,0) 100%)"></span><div class="wp-block-cover__image-background wp-image-8 has-parallax is-repeated" style="background-position:71% 48%;background-image:url(https://dreamy-smakager-a34377.netlify.app/wp-content/uploads/2024/05/luke-chesser-rCOWMC8qf8A-unsplash-1.jpg)"></div><div class="wp-block-cover__inner-container"><!-- wp:group {"metadata":{"name":"Features"},"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|40","bottom":"var:preset|spacing|40"}}},"layout":{"type":"default"}} -->
<div class="wp-block-group alignfull" style="padding-top:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--40)"><!-- wp:columns {"isStackedOnMobile":false,"style":{"spacing":{"padding":{"top":"0","bottom":"0"},"margin":{"top":"0","bottom":"var:preset|spacing|60"}}},"twAnimation":"fade-in-up","twAnimationDelay":0.5} -->
<div class="wp-block-columns is-not-stacked-on-mobile" style="margin-top:0;margin-bottom:var(--wp--preset--spacing--60);padding-top:0;padding-bottom:0"><!-- wp:column {"width":"65%","layout":{"type":"default"}} -->
<div class="wp-block-column" style="flex-basis:65%"><!-- wp:image {"id":14,"width":"64px","height":"64px","sizeSlug":"full","linkDestination":"none","align":"right","style":{"color":{"duotone":["#07ded0","#ffffff"]},"border":{"color":"#5b6666","width":"2px","radius":"10px"}},"className":"is-style-rounded"} -->
<figure class="wp-block-image alignright size-full is-resized has-custom-border is-style-rounded"><img src="https://dreamy-smakager-a34377.netlify.app/wp-content/uploads/2024/05/dashboard.webp" alt="" class="has-border-color wp-image-14" style="border-color:#5b6666;border-width:2px;border-radius:10px;width:64px;height:64px"/></figure>
<!-- /wp:image --></div>
<!-- /wp:column -->

<!-- wp:column {"verticalAlignment":"center","width":"35%"} -->
<div class="wp-block-column is-vertically-aligned-center" style="flex-basis:35%"><!-- wp:heading {"style":{"typography":{"lineHeight":"1.5"},"spacing":{"padding":{"top":"0","bottom":"0"},"margin":{"top":"0","bottom":"0"}}},"fontSize":"medium"} -->
<h2 class="wp-block-heading has-medium-font-size" style="margin-top:0;margin-bottom:0;padding-top:0;padding-bottom:0;line-height:1.5">200 + Projects</h2>
<!-- /wp:heading -->

<!-- wp:paragraph {"style":{"spacing":{"margin":{"top":"0","right":"0","bottom":"0","left":"0"},"padding":{"bottom":"0"}},"typography":{"fontSize":"14px","letterSpacing":"1px"}}} -->
<p style="margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;padding-bottom:0;font-size:14px;letter-spacing:1px">There are many variations of passages of Lorem IThere are many variations of  </p>
<!-- /wp:paragraph --></div>
<!-- /wp:column --></div>
<!-- /wp:columns -->

<!-- wp:columns {"isStackedOnMobile":false,"style":{"spacing":{"margin":{"top":"0","bottom":"var:preset|spacing|60"}}},"twAnimation":"fade-in-up","twAnimationDelay":0.5} -->
<div class="wp-block-columns is-not-stacked-on-mobile" style="margin-top:0;margin-bottom:var(--wp--preset--spacing--60)"><!-- wp:column {"width":"45%","layout":{"type":"default"}} -->
<div class="wp-block-column" style="flex-basis:45%"><!-- wp:image {"id":15,"width":"64px","height":"64px","sizeSlug":"full","linkDestination":"none","align":"right","style":{"color":{"duotone":["#07ded0","#ffffff"]},"border":{"color":"#5b6666","width":"2px","radius":"10px"}},"className":"is-style-rounded"} -->
<figure class="wp-block-image alignright size-full is-resized has-custom-border is-style-rounded"><img src="https://dreamy-smakager-a34377.netlify.app/wp-content/uploads/2024/05/data.webp" alt="" class="has-border-color wp-image-15" style="border-color:#5b6666;border-width:2px;border-radius:10px;width:64px;height:64px"/></figure>
<!-- /wp:image --></div>
<!-- /wp:column -->

<!-- wp:column {"verticalAlignment":"center","width":"35%"} -->
<div class="wp-block-column is-vertically-aligned-center" style="flex-basis:35%"><!-- wp:heading {"style":{"typography":{"lineHeight":"1.5"},"spacing":{"padding":{"top":"0","bottom":"0"},"margin":{"top":"0","bottom":"0px"}}},"fontSize":"medium"} -->
<h2 class="wp-block-heading has-medium-font-size" style="margin-top:0;margin-bottom:0px;padding-top:0;padding-bottom:0;line-height:1.5">10 +  Services</h2>
<!-- /wp:heading -->

<!-- wp:paragraph {"style":{"spacing":{"margin":{"top":"0","right":"0","bottom":"0","left":"0"},"padding":{"bottom":"0","top":"0px"}},"typography":{"fontSize":"14px","letterSpacing":"1px"}}} -->
<p style="margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;padding-top:0px;padding-bottom:0;font-size:14px;letter-spacing:1px">There are many variations of passages of Lorem IThere are many variations of  </p>
<!-- /wp:paragraph --></div>
<!-- /wp:column --></div>
<!-- /wp:columns -->

<!-- wp:columns {"isStackedOnMobile":false,"twAnimation":"fade-in-up","twAnimationDelay":0.5} -->
<div class="wp-block-columns is-not-stacked-on-mobile"><!-- wp:column {"width":"30%","layout":{"type":"default"}} -->
<div class="wp-block-column" style="flex-basis:30%"><!-- wp:image {"id":16,"width":"64px","height":"64px","sizeSlug":"full","linkDestination":"none","align":"right","style":{"color":{"duotone":["#07ded0","#ffffff"]},"border":{"radius":"10px","color":"#5b6666","width":"2px"}},"className":"is-style-default"} -->
<figure class="wp-block-image alignright size-full is-resized has-custom-border is-style-default"><img src="https://dreamy-smakager-a34377.netlify.app/wp-content/uploads/2024/05/earth.webp" alt="" class="has-border-color wp-image-16" style="border-color:#5b6666;border-width:2px;border-radius:10px;width:64px;height:64px"/></figure>
<!-- /wp:image --></div>
<!-- /wp:column -->

<!-- wp:column {"verticalAlignment":"center","width":"35%"} -->
<div class="wp-block-column is-vertically-aligned-center" style="flex-basis:35%"><!-- wp:heading {"style":{"typography":{"lineHeight":"1.5"},"spacing":{"padding":{"top":"0","bottom":"0"},"margin":{"top":"0","bottom":"0px"}}},"fontSize":"medium"} -->
<h2 class="wp-block-heading has-medium-font-size" style="margin-top:0;margin-bottom:0px;padding-top:0;padding-bottom:0;line-height:1.5">50 + Clients</h2>
<!-- /wp:heading -->

<!-- wp:paragraph {"style":{"spacing":{"margin":{"top":"0","right":"0","bottom":"0","left":"0"},"padding":{"bottom":"0","top":"0px"}},"typography":{"fontSize":"14px","letterSpacing":"1px"}}} -->
<p style="margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;padding-top:0px;padding-bottom:0;font-size:14px;letter-spacing:1px">There are many variations of passages of Lorem IThere are many variations of passages of  </p>
<!-- /wp:paragraph --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
<!-- /wp:group --></div></div>
<!-- /wp:cover -->