CSS text effect style : demo 115

Best jQuery

HTML

                        
Best jQuery

CSS

(Fonts required : Tourney)
                        .text-effect{
                            background-repeat: no-repeat;
                            background-image: radial-gradient(circle farthest-corner at center center, #34ace0 0%, #34ace0 50%, transparent 50.1%);
                            background-position: 50% 50%;
                            background-size: 0 0;
                            font-family: 'Rancho', cursive;
                            font-size: 150px;
                            font-weight: 600;
                            text-align: center;
                            -webkit-text-stroke-color:#227093;
                            -webkit-text-stroke-width: 0.001em;
                            -webkit-text-fill-color: transparent;
                            -webkit-background-clip: text;
                            animation: animate 2s infinite linear;
                        }
                        @keyframes animate{
                            100%{ background-size: 180% 400%; }
                        }
                        @media only screen and (max-width: 990px){
                            .text-effect{ font-size: 110px; }
                        }
                        @media only screen and (max-width: 767px){
                            .text-effect{ font-size: 90px; }
                        }
                        @media only screen and (max-width: 576px){
                            .text-effect{ font-size: 70px; }
                        }
                        @media only screen and (max-width: 479px){
                            .text-effect{
                                font-size: 50px;
                                line-height: 50px;
                            }
                        }
                    
License Terms