CSS text effect style : demo 236

                        

                            Best jQuery
                        
                    

                        :root { --color:#e5719f; }
                        .text-effect {
                            color: var(--color);
                            font-family: "Lalezar", system-ui;
                            font-size: 100px;
                            font-weight: 500;
                            text-align: center;
                            position: relative;
                            animation: animate 2s infinite;
                        }
                        @keyframes animate {
                                0%,12.5% { transform: translateX(10px) translateY(0); }
                                 13%,25% { transform: translateX(4px) translateY(-4px); }
                               26%,37.5% { transform: translateX(2px) translateY(8px); }
                                 38%,50% { transform: translateX(12px) translateY(-6px); }
                               51%,62.5% { transform: translateX(0) translateY(12px); }
                                63%,75%  { transform: translateX(-8px) translateY(-4px); }
                               76%,86.5% { transform: translateX(-12px) translateY(6px); }
                                87%,100% { transform: translateX(6px) translateY(0); }
                        }
                        @media only screen and (max-width: 990px){
                            .text-effect{ font-size: 70px; }
                        }
                        @media only screen and (max-width: 767px){
                            .text-effect{ font-size: 60px; }
                        }
                        @media only screen and (max-width: 576px){
                            .text-effect{ font-size: 40px; }
                        }