Skip to content
Gutenberg Hub
  • Getting Started
    • User
    • Developer
  • Resources
    • User Guides
    • Plugins & Themes
      • Plugins/Addons
      • Themes
    • Developer Guides
    • Tips & Tricks
    • Code Snippets
    • Talks & Opinions
  • Blocks
  • Templates
    • Section Patterns
    • Full Page Templates
Gutenberg Hub
Menu

Card 4

Card 4 is a Free Gutenberg Card, Section Patterns Template by GutenbergHub. It is fully customizable, responsive, and easy to use. The best part is you can copy & paste it to your website. Our Gutenberg Templates library has a huge collection of WordPress block patterns. Find out more Card, Section Patterns Templates.

CardSection Patterns
Facebook Twitter Pinterest LinkedIn
Previous Template Card 3
Next Template Card 5

<!-- wp:cover {"customOverlayColor":"#0073aa","align":"full","className":"eplus-Wk0s0K","epGeneratedClass":"eplus-Wk0s0K","editorPlusCustomCSS":".eplus-Wk0s0K .wp-block-columns {\n margin: auto;\n}\n.eplus-Wk0s0K .wp-block-cover::before{\n content: \u0022\\A\u0022;\n position: absolute;\n bottom: 0;\n width: 0;\n height: 0;\n border-left: 18px solid transparent;\n border-right: 18px solid transparent;\n border-bottom: 25px solid #313131;\n}\n.wp-block-cover {\n height: auto;\n}"} --> <div class="wp-block-cover alignfull has-background-dim eplus-Wk0s0K" style="background-color:#0073aa"><div class="wp-block-cover__inner-container"><!-- wp:spacer {"className":"ticss-ce381d84 eplus-dgPm70","epGeneratedClass":"eplus-dgPm70"} --> <div style="height:100px" aria-hidden="true" class="wp-block-spacer ticss-ce381d84 eplus-dgPm70"></div> <!-- /wp:spacer --> <!-- wp:columns {"className":"eplus-KbSTPU","epGeneratedClass":"eplus-KbSTPU","epCustomSizing":{"height":{"value":"","important":false,"unit":"%"},"width":{"value":80,"important":false,"unit":"%"}}} --> <div class="wp-block-columns eplus-KbSTPU"><!-- wp:column {"className":"eplus-ZVAkJh","epGeneratedClass":"eplus-ZVAkJh"} --> <div class="wp-block-column eplus-ZVAkJh"><!-- wp:group {"className":"eplus-Ge3NVN","epGeneratedClass":"eplus-Ge3NVN"} --> <div class="wp-block-group eplus-Ge3NVN"><div class="wp-block-group__inner-container"><!-- wp:cover {"url":"https://wordpressmu-313146-998730.cloudwaysapps.com/gut-templates/wp-content/uploads/sites/10/2020/01/image-sub-4344-16.png","id":1330,"dimRatio":0,"minHeight":250,"className":"triangle ticss-f74fa6df eplus-GBCTlN","epGeneratedClass":"eplus-GBCTlN"} --> <div class="wp-block-cover triangle ticss-f74fa6df eplus-GBCTlN" style="background-image:url(https://wordpressmu-313146-998730.cloudwaysapps.com/gut-templates/wp-content/uploads/sites/10/2020/01/image-sub-4344-16.png);min-height:250px"><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"center","placeholder":"Write title…","fontSize":"large","className":"eplus-wnf248","epGeneratedClass":"eplus-wnf248"} --> <p class="has-text-align-center has-large-font-size eplus-wnf248"></p> <!-- /wp:paragraph --></div></div> <!-- /wp:cover --> <!-- wp:paragraph {"align":"center","textColor":"very-light-gray","backgroundColor":"very-dark-gray","customFontSize":21,"className":"eplus-phVfIf","epCustomMargin":{"value":{"top":"0","right":"0","bottom":"0","left":"0"},"unit":"%","important":true},"epGeneratedClass":"eplus-phVfIf"} --> <p style="font-size:21px" class="has-text-color has-background has-text-align-center has-very-light-gray-color has-very-dark-gray-background-color eplus-phVfIf">OUR SERVICES</p> <!-- /wp:paragraph --> <!-- wp:group {"className":"has-background eplus-UVQFrK","epGeneratedClass":"eplus-UVQFrK","epCustomBackground":{"solid":"rgba(255, 255, 255, 1)","gradient":"","media":{"backgroundPositionX":"","backgroundPositionY":"","background":{},"backgroundSize":"","backgroundRepeat":""}}} --> <div class="wp-block-group has-background eplus-UVQFrK"><div class="wp-block-group__inner-container"><!-- wp:paragraph {"align":"center","textColor":"very-dark-gray","className":"eplus-jC4hwH","epGeneratedClass":"eplus-jC4hwH"} --> <p class="has-text-color has-text-align-center has-very-dark-gray-color eplus-jC4hwH">Lorem ipsum dolor amet consec tetur adipiscing elit eiusmod tempor incididunt labore dolore magna alirua enim minim veniam nost.</p> <!-- /wp:paragraph --> <!-- wp:button {"backgroundColor":"vivid-cyan-blue","borderRadius":0,"align":"center","className":"eplus-m4mM53","epGeneratedClass":"eplus-m4mM53"} --> <div class="wp-block-button aligncenter eplus-m4mM53"><a class="wp-block-button__link has-background has-vivid-cyan-blue-background-color no-border-radius">Read More</a></div> <!-- /wp:button --></div></div> <!-- /wp:group --></div></div> <!-- /wp:group --></div> <!-- /wp:column --> <!-- wp:column {"className":"eplus-GATEiv","epGeneratedClass":"eplus-GATEiv"} --> <div class="wp-block-column eplus-GATEiv"><!-- wp:group {"className":"eplus-rwtCu8","epGeneratedClass":"eplus-rwtCu8"} --> <div class="wp-block-group eplus-rwtCu8"><div class="wp-block-group__inner-container"><!-- wp:cover {"url":"https://wordpressmu-313146-998730.cloudwaysapps.com/gut-templates/wp-content/uploads/sites/10/2020/01/image-sub-4344-16.png","id":1330,"dimRatio":0,"minHeight":250,"className":"triangle ticss-f74fa6df eplus-odE7ke","epGeneratedClass":"eplus-odE7ke"} --> <div class="wp-block-cover triangle ticss-f74fa6df eplus-odE7ke" style="background-image:url(https://wordpressmu-313146-998730.cloudwaysapps.com/gut-templates/wp-content/uploads/sites/10/2020/01/image-sub-4344-16.png);min-height:250px"><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"center","placeholder":"Write title…","fontSize":"large","className":"eplus-eJp7ND","epGeneratedClass":"eplus-eJp7ND"} --> <p class="has-text-align-center has-large-font-size eplus-eJp7ND"></p> <!-- /wp:paragraph --></div></div> <!-- /wp:cover --> <!-- wp:paragraph {"align":"center","textColor":"very-light-gray","backgroundColor":"very-dark-gray","customFontSize":21,"className":"eplus-47eWrP","epCustomMargin":{"value":{"top":"0","right":"0","bottom":"0","left":"0"},"unit":"%","important":true},"epGeneratedClass":"eplus-47eWrP"} --> <p style="font-size:21px" class="has-text-color has-background has-text-align-center has-very-light-gray-color has-very-dark-gray-background-color eplus-47eWrP">OUR SERVICES</p> <!-- /wp:paragraph --> <!-- wp:group {"className":"has-background eplus-TM87EW","epGeneratedClass":"eplus-TM87EW","epCustomBackground":{"solid":"rgba(255, 255, 255, 1)","gradient":"","media":{"backgroundPositionX":"","backgroundPositionY":"","background":{},"backgroundSize":"","backgroundRepeat":""}}} --> <div class="wp-block-group has-background eplus-TM87EW"><div class="wp-block-group__inner-container"><!-- wp:paragraph {"align":"center","textColor":"very-dark-gray","className":"eplus-0Vr283","epGeneratedClass":"eplus-0Vr283"} --> <p class="has-text-color has-text-align-center has-very-dark-gray-color eplus-0Vr283">Lorem ipsum dolor amet consec tetur adipiscing elit eiusmod tempor incididunt labore dolore magna alirua enim minim veniam nost.</p> <!-- /wp:paragraph --> <!-- wp:button {"backgroundColor":"vivid-cyan-blue","borderRadius":0,"align":"center","className":"eplus-sz4Les","epGeneratedClass":"eplus-sz4Les"} --> <div class="wp-block-button aligncenter eplus-sz4Les"><a class="wp-block-button__link has-background has-vivid-cyan-blue-background-color no-border-radius">Read More</a></div> <!-- /wp:button --></div></div> <!-- /wp:group --></div></div> <!-- /wp:group --></div> <!-- /wp:column --> <!-- wp:column {"className":"eplus-wssyd4","epGeneratedClass":"eplus-wssyd4"} --> <div class="wp-block-column eplus-wssyd4"><!-- wp:group {"className":"eplus-isWZdJ","epGeneratedClass":"eplus-isWZdJ"} --> <div class="wp-block-group eplus-isWZdJ"><div class="wp-block-group__inner-container"><!-- wp:cover {"url":"https://wordpressmu-313146-998730.cloudwaysapps.com/gut-templates/wp-content/uploads/sites/10/2020/01/image-sub-4344-16.png","id":1330,"dimRatio":0,"minHeight":250,"className":"triangle ticss-f74fa6df eplus-AWp68T","epGeneratedClass":"eplus-AWp68T"} --> <div class="wp-block-cover triangle ticss-f74fa6df eplus-AWp68T" style="background-image:url(https://wordpressmu-313146-998730.cloudwaysapps.com/gut-templates/wp-content/uploads/sites/10/2020/01/image-sub-4344-16.png);min-height:250px"><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"center","placeholder":"Write title…","fontSize":"large","className":"eplus-NNYwEE","epGeneratedClass":"eplus-NNYwEE"} --> <p class="has-text-align-center has-large-font-size eplus-NNYwEE"></p> <!-- /wp:paragraph --></div></div> <!-- /wp:cover --> <!-- wp:paragraph {"align":"center","textColor":"very-light-gray","backgroundColor":"very-dark-gray","customFontSize":21,"className":"eplus-GoxgZl","epCustomMargin":{"value":{"top":"0","right":"0","bottom":"0","left":"0"},"unit":"%","important":true},"epGeneratedClass":"eplus-GoxgZl"} --> <p style="font-size:21px" class="has-text-color has-background has-text-align-center has-very-light-gray-color has-very-dark-gray-background-color eplus-GoxgZl">OUR SERVICES</p> <!-- /wp:paragraph --> <!-- wp:group {"className":"has-background eplus-rIVpG5","epGeneratedClass":"eplus-rIVpG5","epCustomBackground":{"solid":"rgba(255, 255, 255, 1)","gradient":"","media":{"backgroundPositionX":"","backgroundPositionY":"","background":{},"backgroundSize":"","backgroundRepeat":""}}} --> <div class="wp-block-group has-background eplus-rIVpG5"><div class="wp-block-group__inner-container"><!-- wp:paragraph {"align":"center","textColor":"very-dark-gray","className":"eplus-udmDpN","epGeneratedClass":"eplus-udmDpN"} --> <p class="has-text-color has-text-align-center has-very-dark-gray-color eplus-udmDpN">Lorem ipsum dolor amet consec tetur adipiscing elit eiusmod tempor incididunt labore dolore magna alirua enim minim veniam nost.</p> <!-- /wp:paragraph --> <!-- wp:button {"backgroundColor":"vivid-cyan-blue","borderRadius":0,"align":"center","className":"eplus-oe5S7j","epGeneratedClass":"eplus-oe5S7j"} --> <div class="wp-block-button aligncenter eplus-oe5S7j"><a class="wp-block-button__link has-background has-vivid-cyan-blue-background-color no-border-radius">Read More</a></div> <!-- /wp:button --></div></div> <!-- /wp:group --></div></div> <!-- /wp:group --></div> <!-- /wp:column --></div> <!-- /wp:columns --> <!-- wp:spacer {"className":"eplus-SNr3c3","epGeneratedClass":"eplus-SNr3c3"} --> <div style="height:100px" aria-hidden="true" class="wp-block-spacer eplus-SNr3c3"></div> <!-- /wp:spacer --></div></div> <!-- /wp:cover -->

Browse Template By Type

  • 🌓 Section Patterns
  • 🌕 Full Page Templates

Browse Section Patterns

  • 👉 All Section Patterns
  • 🦸‍♂️ Hero
  • 🎢 Slider
  • 📝 Testimonial
  • 👨‍👧‍👧 Team
  • 🎉 Feature
  • 💰 Pricing
  • 🃏 Card
  • 📊 Stats
  • 📄 Content
  • 🏞 Gallery
  • ❓ FAQ
  • 💠 Logos
  • ⌚ Business Hours

Required Plugin(s)

EditorPlus

How to Copy a Template

Thumbnail

Facebook Facebook Group Twitter YouTube
  • Getting Started
  • Resources
  • Blocks
  • Templates

Copyright © 2021 Gutenberg Hub

  • Getting Started
    • User
    • Developer
  • Resources
    • User Guides
    • Plugins & Themes
      • Plugins/Addons
      • Themes
    • Developer Guides
    • Tips & Tricks
    • Code Snippets
    • Talks & Opinions
  • Blocks
  • Templates
    • Section Patterns
    • Full Page Templates