Get Ready Elementor Templates

Unique Card Shape Using Elementor | Elementor Pro Tutorial

Subscribe To My YouTube Channel For More Upcoming Videos

Unique Card Shape CSS

selector .card{
    box-shadow: 0 10px 0px rgba(255,255,255,1), inset 0 -15px 0 rgba(255,255,255,0.25), 0 45px 0 rgba(0,0,0,0.25);
}
selector .card:before{
    content:"";
    width: 100%;
    height: 120%;
    background: linear-gradient(90deg,transparent, rgba(255,255,255,0.2));
    position: absolute;
    top: -140px;
    left: -35%;
    pointer-events: none;
    filter: blur(5px);
    transform: rotate(35deg);
    border-radius: 0px;
}
selector .icon-section .elementor-widget-container{
    height: 120px;
    box-shadow: 0 10px 0px rgba(0,0,0,0.1), inset 0 -8px 0 rgba(255,255,255,1);
}
selector .icon-section{
    position: relative;
}
selector .icon-section:before{
    content: "";
    width: 50px;
    height: 50px;
    left: -50px;
    background: transparent;
    border-radius: 0px 50px 0px 0px;
    box-shadow: 15px -15px 0px 15px #3c2846;
    position: absolute;
}
selector .icon-section:after{
    content: "";
    width: 50px;
    height: 50px;
    right: -50px;
    background: transparent;
    border-radius: 50px 0px 0px 0px;
    box-shadow: -15px -15px 0px 15px #3c2846;
    position: absolute;
    top: 0;
}
selector .icon-section .elementor-icon i{
    z-index: 2;
}
Wanna join my secret winners’ gang?

I only share these secrets with the people in this group. Honestly, you can not find such tricks for FREE on the whole internet!

  • Money Making Blog Tricks
  • $100k by Freelancing Formula
  • Secret Resources
  • Rich Dad business tactics
  • And, of course about my upcoming videos and plans