react-creative-text
Version:
A powerful React component for creating beautiful, customizable text with SVG. Support for Google Fonts, strokes, shadows, 1000+ fonts families and more.
1 lines • 1.5 kB
Source Map (JSON)
{"version":3,"sources":["index.css"],"names":[],"mappings":"AAAA,EAGE,qBAAsB,CAFtB,QAAW,CACX,SAEF,CAEA,yBACE,oBAAqB,CACrB,uBACF,CAGA,mBACE,GACE,SACF,CAEA,GACE,SACF,CACF,CAEA,iBACE,mCACF,CAGA,oBACE,GAEE,SAAU,CADV,0BAEF,CAEA,GAEE,SAAU,CADV,uBAEF,CACF,CAEA,kBACE,oCACF,CAGA,kBAEE,kBAKE,uBACF,CAEA,IACE,2BACF,CAEA,IACE,2BACF,CACF,CAEA,gBACE,iCACF,CAGA,iBAEE,MAEE,SACF,CAEA,IACE,UACF,CACF,CAEA,eACE,yCACF","file":"index.css","sourcesContent":["* {\n margin: 0px;\n padding: 0px;\n box-sizing: border-box;\n}\n\n.creative-text-container {\n display: inline-block;\n transition: all 0.3s ease;\n}\n\n/* Fade In */\n@keyframes fade-in {\n from {\n opacity: 0;\n }\n\n to {\n opacity: 1;\n }\n}\n\n.animate-fade-in {\n animation: fade-in 0.5s ease forwards;\n}\n\n/* Slide In (from bottom) */\n@keyframes slide-in {\n from {\n transform: translateY(20px);\n opacity: 0;\n }\n\n to {\n transform: translateY(0);\n opacity: 1;\n }\n}\n\n.animate-slide-in {\n animation: slide-in 0.5s ease forwards;\n}\n\n/* Bounce */\n@keyframes bounce {\n\n 0%,\n 20%,\n 50%,\n 80%,\n 100% {\n transform: translateY(0);\n }\n\n 40% {\n transform: translateY(-20px);\n }\n\n 60% {\n transform: translateY(-10px);\n }\n}\n\n.animate-bounce {\n animation: bounce 1s ease infinite;\n}\n\n/* Glow / Pulse */\n@keyframes pulse {\n\n 0%,\n 100% {\n opacity: 1;\n }\n\n 50% {\n opacity: 0.5;\n }\n}\n\n.animate-pulse {\n animation: pulse 1.5s ease-in-out infinite;\n}"]}