CSS text effect style : demo 78

Best jQuery

HTML

                        
Best jQuery

CSS

(Fonts required : VT323)
                        .text-effect{
                            font-family: 'VT323', monospace;
                            font-size: 120px;
                            text-align: center;
                            text-transform: uppercase;
                            animation: animate 1s infinite;
                        }
                        @keyframes animate{
                            0%{
                                color: lime;
                                text-shadow: 0 0 20px green;
                            }
                            25%{
                                color: green;
                                text-shadow: 2px 2px 2px lime;
                                transform: translate(-2px, 1px);
                            }
                            40%{
                                color: lime;
                                text-shadow: none;
                                transform: translate(0, 0);
                            }
                            50%{
                                color: green;
                                text-shadow: 5px 5px 2px blue, -5px -5px 2px red;
                                transform: translate(0px, 5px);
                            }
                            70%{
                                color: lime;
                                text-shadow: none;
                                transform: translate(0, 0);
                            }
                            80%{
                                color: lime;
                                text-shadow: 0 0 20px green;
                                transform: translate(-2px, 1px);
                            }
                            100%{
                                color: lime;
                                text-shadow: none;
                            }
                        }
                        @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: 60px; }
                        }
                        @media only screen and (max-width: 479px){
                            .text-effect{ font-size: 45px; }
                        }
                    
License Terms