Next Level Elementor Custom ANIMATED BORDER | Elementor Tips & Tricks

[@thecreativarena]

Copy and Paste Code below @property --a { syntax: ''; initial-value: 0deg; inherits: true; } .box{ position: relative; background: repeating-conic-gradient(from var(--a),#C84F06 0%, #C84F06 5%, transparent 5%, transparent 40%, #C84F06 50%); animation: animate 4s linear infinite; } @keyframes animate { 0%{ --a: 0deg; } 100%{ --a: 360deg; } } .box::before{ content: ''; position: absolute; width: 100%; height: 100%; border-radius: 10px; background: repeating-conic-gradient(from var(--a),#C84F06 0%, #C84F06 5%, transparent 5%, transparent 40%, #C84F06 50%); animation: animate 4s linear infinite; animation-delay: -1s; } .box::after{ content: ''; position: absolute; width: 96%; height: 96%; background: #1a3142; left: 50%; top: 50%; transform: translate(-50%, -50%); border-radius: 10px; }

[@AbuchiOkafor-pk2hi]

Nice one

[@JasonOtto]

Thank you, your time and effort and the resultant code, it's very much appreciated. Liked and subscribed - go YOU!!! Awesome content, don't stop.

[@soheildanesh]

Perfect,thanks for you amazing tutorial

[@triciastdominic-my3ri]

Awesome