Help
RSS
API
Feed
Maltego
Contact
Domain > ovvth.com
×
More information on this domain is in
AlienVault OTX
Is this malicious?
Yes
No
DNS Resolutions
Date
IP Address
2015-11-10
58.96.169.140
(
ClassC
)
2026-01-24
172.67.152.32
(
ClassC
)
Port 443
HTTP/1.1 200 OKDate: Sat, 24 Jan 2026 20:50:20 GMTContent-Type: text/html;charsetutf-8Transfer-Encoding: chunkedConnection: keep-aliveServer: cloudflareNel: {report_to:cf-nel,success_fraction:0.0,max_age:604800}Vary: Accept-EncodingReport-To: {group:cf-nel,max_age:604800,endpoints:{url:https://a.nel.cloudflare.com/report/v4?silEz6WviD%2BsoiiJ%2BvaT8Hzlt6vXRJO%2F1KG9kfYAUxjCUU2KNCDtosKDAC8YEGOKwHRAJErgZ8Ytmiq%2BgU3zT%2BueLTauwEncjIQ%3D%3D}}Last-Modified: Fri, 12 Dec 2025 08:53:18 GMTcf-cache-status: DYNAMICCF-RAY: 9c32670cff20acc8-PDXalt-svc: h3:443; ma86400 !DOCTYPE html>html langen>head>meta charsetutf-8>meta nameviewport contentwidthdevice-width, initial-scale1>title>Ovvth - Frontend Code Snippets | CSS, TypeScript, Vue, React/title>link relpreconnect hrefhttps://fonts.googleapis.com>link relpreconnect hrefhttps://fonts.gstatic.com crossorigin>script srchttps://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?clientca-pub-3237033247681261 crossoriginanonymous async data-ad-channel>/script>link relstylesheet hrefhttps://fonts.googleapis.com/css2?familyOrbitron:wght@400;500;600;700;800;900&familyExo+2:wght@300;400;500;600;700&familyFira+Code:wght@400;500&displayswap>style>:root{--color-bg-dark:#0a0a0f;--color-bg-deep:#0d0d14;--color-bg-card:rgba(20,20,30,.7);--color-orange-primary:#ff6b00;--color-orange-light:#ff8c38;--color-orange-dark:#e55a00;--color-amber:#ffb347;--color-lava:#ff4500;--color-cyan:#00d4ff;--color-purple:#9d4edd;--color-text-primary:#fff;--color-text-secondary:hsla(0,0%,100%,.7);--color-text-muted:hsla(0,0%,100%,.5);--gradient-orange:linear-gradient(135deg,#ff6b00,#ffb347 50%,#ff4500);--gradient-lava:linear-gradient(180deg,#ff6b00,#e55a00 50%,#ff4500);--gradient-glow:linear-gradient(135deg,rgba(255,107,0,.3),rgba(255,179,71,.1));--glass-bg:rgba(20,20,30,.6);--glass-border:rgba(255,107,0,.2);--glass-blur:20px;--shadow-orange:0 0 30px rgba(255,107,0,.3);--shadow-glow:0 0 60px rgba(255,107,0,.2);--shadow-card:0 8px 32px rgba(0,0,0,.4);--font-heading:Orbitron,sans-serif;--font-body:Exo 2,sans-serif;--container-max:1400px;--section-padding:80px}*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth}body{background-color:var(--color-bg-dark);color:var(--color-text-primary);font-family:var(--font-body);line-height:1.6;min-height:100vh;overflow-x:hidden}body:before{background:radial-gradient(ellipse at 20% 0,rgba(255,107,0,.15) 0,transparent 50%),radial-gradient(ellipse at 80% 100%,rgba(255,69,0,.1) 0,transparent 50%),radial-gradient(ellipse at 50% 50%,rgba(157,78,221,.05) 0,transparent 70%)}body:after,body:before{content:;height:100%;left:0;pointer-events:none;position:fixed;top:0;width:100%;z-index:-1}body:after{background-image:linear-gradient(rgba(255,107,0,.03) 1px,transparent 0),linear-gradient(90deg,rgba(255,107,0,.03) 1px,transparent 0);background-size:50px 50px}.container{margin:0 auto;max-width:var(--container-max);padding:0 24px}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:700;letter-spacing:.02em;line-height:1.2}h1{font-size:clamp(2.5rem,6vw,4rem);text-shadow:4px 4px 0 rgba(255,107,0,.3),8px 8px 0 rgba(255,107,0,.1)}h2{font-size:clamp(1.8rem,4vw,2.5rem);text-shadow:3px 3px 0 rgba(255,107,0,.2)}h3{font-size:clamp(1.3rem,3vw,1.8rem)}p{color:var(--color-text-secondary);font-size:1rem}a{color:inherit;text-decoration:none;transition:all .3s ease}.glass-card{backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:16px;overflow:hidden;position:relative;transition:all .4s cubic-bezier(.4,0,.2,1)}.glass-card:before{background:linear-gradient(90deg,transparent,rgba(255,107,0,.5),transparent);content:;height:1px;left:0;position:absolute;right:0;top:0}.glass-card:after{background:linear-gradient(135deg,rgba(255,107,0,.3),transparent,rgba(255,179,71,.2));border-radius:16px;content:;inset:0;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;padding:1px;pointer-events:none;position:absolute}.glass-card:hover{border-color:#ff6b0066;box-shadow:var(--shadow-orange),var(--shadow-card);transform:translateY(-5px)}.energy-btn{align-items:center;background:var(--gradient-orange);border:none;border-radius:8px;box-shadow:0 4px 15px #ff6b0066;color:var(--color-bg-dark);cursor:pointer;display:inline-flex;font-family:var(--font-heading);font-size:.9rem;font-weight:600;gap:8px;justify-content:center;letter-spacing:.1em;overflow:hidden;padding:14px 32px;position:relative;text-transform:uppercase;transition:all .3s ease}.energy-btn:before{background:#ffffff4d;border-radius:50%;content:;height:0;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .6s ease,height .6s ease;width:0}.energy-btn:hover{box-shadow:0 6px 25px #ff6b0080;transform:translateY(-2px)}.energy-btn:hover:before{height:300px;width:300px}.energy-btn:active{transform:translateY(0)}@keyframes energyPulse{0%,to{box-shadow:0 0 #ff6b0066}50%{box-shadow:0 0 0 15px #ff6b0000}}.pulse{animation:energyPulse 2s infinite}.lava-progress{background:#ff6b001a;height:6px;overflow:hidden}.lava-progress,.lava-progress-bar{border-radius:3px;position:relative}.lava-progress-bar{background:var(--gradient-lava);height:100%;transition:width 1s ease}.lava-progress-bar:after{animation:lavaFlow 2s infinite;background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.3),transparent);content:;inset:0;position:absolute}@keyframes lavaFlow{0%{transform:translate(-100%)}to{transform:translate(100%)}}.energy-badge{align-items:center;background:#ff6b001a;border:1px solid rgba(255,107,0,.3);border-radius:20px;color:var(--color-orange-primary);display:inline-flex;font-family:var(--font-heading);font-size:.75rem;font-weight:600;gap:6px;letter-spacing:.05em;padding:6px 14px;position:relative;text-transform:uppercase}.energy-badge:before{animation:badgePulse 1.5s infinite;background:var(--color-orange-primary);border-radius:50%;box-shadow:0 0 10px var(--color-orange-primary);content:;height:6px;width:6px}@keyframes badgePulse{0%,to{opacity:1}50%{opacity:.5}}.particles-container{height:100%;left:0;overflow:hidden;pointer-events:none;position:fixed;top:0;width:100%;z-index:0}.particle{animation:floatParticle 15s linear infinite;background:var(--color-orange-primary);border-radius:50%;height:4px;opacity:.6;position:absolute;width:4px}@keyframes floatParticle{0%{opacity:0;transform:translateY(100vh) translate(0)}10%{opacity:.6}90%{opacity:.6}to{opacity:0;transform:translateY(-100px) translate(100px)}}.data-flow{animation:dataFlowAnim 3s infinite;background:linear-gradient(180deg,transparent,var(--color-orange-primary),transparent);height:100px;position:absolute;width:2px}@keyframes dataFlowAnim{0%{opacity:0;transform:translateY(-100%)}50%{opacity:1}to{opacity:0;transform:translateY(200%)}}.holographic{background:linear-gradient(135deg,#ff6b001a,#00d4ff0d 50%,#9d4edd1a);position:relative}.holographic:before{background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(255,107,0,.03) 0,rgba(255,107,0,.03) 4px);content:;inset:0;pointer-events:none;position:absolute}.tag{background:#ff6b001a;border-radius:4px;color:var(--color-orange-light);display:inline-block;font-size:.75rem;font-weight:500;padding:4px 12px;transition:all .3s ease}.tag:hover{background:#ff6b0033;color:var(--color-orange-primary)}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--color-bg-deep)}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--color-orange-primary),var(--color-orange-dark));border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--color-orange-light)}::-moz-selection{background:#ff6b004d;color:var(--color-text-primary)}::selection{background:#ff6b004d;color:var(--color-text-primary)}.text-gradient{background:var(--gradient-orange);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.glow-text{text-shadow:0 0 10px rgba(255,107,0,.5),0 0 20px rgba(255,107,0,.3)}.section-padding{padding:var(--section-padding) 0}@media(max-width:768px){:root{--section-padding:50px}.container{padding:0 16px}}.page-enter-active,.page-leave-active{transition:all .3s ease}.page-enter-from,.page-leave-to{opacity:0;transform:translateY(20px)}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton{animation:shimmer 1.5s infinite;background:linear-gradient(90deg,#ff6b001a,#ff6b0033 50%,#ff6b001a);background-size:200% 100%}/style>style>.app-wrapperdata-v-27b33522{display:flex;flex-direction:column;min-height:100vh;position:relative}.main-headerdata-v-27b33522{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#0a0a0fe6;border-bottom:1px solid rgba(255,107,0,.2);left:0;position:fixed;right:0;top:0;z-index:1000}.header-innerdata-v-27b33522{height:70px;justify-content:space-between}.header-innerdata-v-27b33522,.logo-linkdata-v-27b33522{align-items:center;display:flex}.logo-imgdata-v-27b33522{height:40px;width:auto}.main-navdata-v-27b33522{gap:32px}.main-navdata-v-27b33522,.nav-linkdata-v-27b33522{align-items:center;display:flex}.nav-linkdata-v-27b33522{background:none;border:none;color:var(--color-text-secondary);cursor:pointer;font-family:var(--font-heading);font-size:.85rem;font-weight:500;gap:6px;letter-spacing:.1em;text-transform:uppercase;transition:all .3s ease}.nav-link.router-link-activedata-v-27b33522,.nav-linkdata-v-27b33522:hover{color:var(--color-orange-primary);text-shadow:0 0 10px rgba(255,107,0,.5)}.nav-dropdowndata-v-27b33522{position:relative}.dropdown-arrowdata-v-27b33522{height:14px;transition:transform .3s ease;width:14px}.nav-dropdown:hover .dropdown-arrowdata-v-27b33522{transform:rotate(180deg)}.dropdown-menudata-v-27b33522{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#14141ef2;border:1px solid rgba(255,107,0,.3);border-radius:12px;box-shadow:0 10px 40px #00000080;left:50%;min-width:200px;opacity:0;padding:12px 0;position:absolute;top:100%;transform:translate(-50%) translateY(10px);transition:all .3s ease;visibility:hidden}.nav-dropdown:hover .dropdown-menudata-v-27b33522{opacity:1;transform:translate(-50%) translateY(0);visibility:visible}.dropdown-itemdata-v-27b33522{color:var(--color-text-secondary);display:block;font-size:.9rem;padding:10px 20px;transition:all .3s ease}.dropdown-itemdata-v-27b33522:hover{background:#ff6b001a;color:var(--color-orange-primary);padding-left:28px}.menu-toggledata-v-27b33522{background:none;border:none;cursor:pointer;display:none;flex-direction:column;gap:5px;padding:8px}.menu-bardata-v-27b33522{background:var(--color-orange-primary);height:2px;transition:all .3s ease;width:24px}.main-contentdata-v-27b33522{flex:1;margin-top:70px}.main-footerdata-v-27b33522{background:#0a0a0ff2;border-top:1px solid rgba(255,107,0,.2);margin-top:auto;padding:60px 0 30px}.footer-griddata-v-27b33522{display:grid;gap:40px;grid-template-columns:2fr 1fr 1fr;margin-bottom:40px}.footer-branddata-v-27b33522{max-width:300px}.footer-logodata-v-27b33522{height:35px;margin-bottom:16px}.footer-descdata-v-27b33522{color:var(--color-text-muted);font-size:.9rem;line-height:1.7}.footer-titledata-v-27b33522{color:var(--color-orange-primary);font-family:var(--font-heading);font-size:.9rem;letter-spacing:.05em;margin-bottom:16px;text-transform:uppercase}.footer-linksdata-v-27b33522{display:flex;flex-direction:column;gap:10px}.footer-links adata-v-27b33522{color:var(--color-text-muted);font-size:.9rem;transition:all .3s ease}.footer-links adata-v-27b33522:hover{color:var(--color-orange-primary);padding-left:8px}.footer-bottomdata-v-27b33522{align-items:center;border-top:1px solid rgba(255,107,0,.1);color:var(--color-text-muted);display:flex;font-size:.85rem;justify-content:space-between;padding-top:30px}.footer-domaindata-v-27b33522{color:var(--color-orange-primary);font-family:var(--font-heading)}.data-flow-containerdata-v-27b33522{height:100%;left:0;overflow:hidden;pointer-events:none;position:fixed;top:0;width:100%;z-index:0}@media(max-width:992px){.footer-griddata-v-27b33522{grid-template-columns:1fr 1fr}}@media(max-width:768px){.menu-toggledata-v-27b33522{display:flex}.main-navdata-v-27b33522{background:#0a0a0ffa;flex-direction:column;gap:20px;left:0;opacity:0;padding:24px;position:fixed;right:0;top:70px;transform:translateY(-100%);transition:all .3s ease;visibility:hidden}.main-nav.nav-opendata-v-27b33522{opacity:1;transform:translateY(0);visibility:visible}.nav-dropdowndata-v-27b33522{text-align:center;width:100%}.dropdown-menudata-v-27b33522{background:transparent;border:none;box-shadow:none;opacity:1;padding:10px 0;position:static;transform:none;visibility:visible}.footer-griddata-v-27b33522{grid-template-columns:1fr;text-align:center}.footer-branddata-v-27b33522{max-width:100%}.footer-links adata-v-27b33522:hover{padding-left:0}.footer-bottomdata-v-27b33522{flex-direction:column;gap:10px;text-align:center}}/style>style>.hero-sectiondata-v-f10d7c57{align-items:center;display:flex;min-height:100vh;overflow:hidden;padding:120px 0 80px;position:relative}.hero-bg-effectsdata-v-f10d7c57{inset:0;pointer-events:none;position:absolute}.hero-orbdata-v-f10d7c57{border-radius:50%;filter:blur(100px);position:absolute}.hero-orb-1data-v-f10d7c57{animation:orbFloat-f10d7c57 20s ease-in-out infinite;background:radial-gradient(circle,rgba(255,107,0,.3) 0,transparent 70%);height:600px;right:-100px;top:-200px;width:600px}.hero-orb-2data-v-f10d7c57{animation:orbFloat-f10d7c57 15s ease-in-out infinite reverse;background:radial-gradient(circle,rgba(255,69,0,.2) 0,transparent 70%);bottom:-100px;height:400px;left:-100px;width:400px}@keyframes orbFloat-f10d7c57{0%,to{transform:translate(0) scale(1)}50%{transform:translate(50px,30px) scale(1.1)}}.hero-grid-linesdata-v-f10d7c57{background-image:linear-gradient(rgba(255,107,0,.05) 1px,transparent 0),linear-gradient(90deg,rgba(255,107,0,.05) 1px,transparent 0);background-size:80px 80px;inset:0;opacity:.5;position:absolute;transform:perspective(500px) rotateX(60deg);transform-origin:center bottom}.hero-contentdata-v-f10d7c57{margin:0 auto;max-width:900px;position:relative;text-align:center;z-index:1}.hero-badgedata-v-f10d7c57{display:inline-block;margin-bottom:24px}.hero-titledata-v-f10d7c57{font-size:clamp(2.5rem,8vw,5rem);font-weight:800;line-height:1.1;margin-bottom:24px}.hero-descdata-v-f10d7c57{color:var(--color-text-secondary);font-size:1.25rem;line-height:1.7;margin:0 auto 40px;max-width:600px}.hero-actionsdata-v-f10d7c57{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;margin-bottom:60px}.outline-btndata-v-f10d7c57{align-items:center;background:transparent;border:2px solid var(--color-orange-primary);border-radius:12px;color:var(--color-orange-primary);cursor:pointer;display:inline-flex;font-family:var(--font-heading);font-size:.95rem;font-weight:600;gap:8px;padding:14px 28px;text-decoration:none;transition:all .3s ease}.outline-btndata-v-f10d7c57:hover{background:var(--color-orange-primary);box-shadow:0 8px 25px #ff6b004d;color:#fff;transform:translateY(-2px)}.hero-statsdata-v-f10d7c57{align-items:center;display:flex;flex-wrap:wrap;gap:40px;justify-content:center}.stat-itemdata-v-f10d7c57{text-align:center}.stat-numberdata-v-f10d7c57{display:block;font-family:var(--font-heading);font-size:2.5rem;font-weight:700}.stat-labeldata-v-f10d7c57{color:var(--color-text-muted);font-size:.85rem;letter-spacing:.1em;text-transform:uppercase}.stat-dividerdata-v-f10d7c57{background:linear-gradient(180deg,transparent,var(--color-orange-primary),transparent);height:40px;width:1px}.categories-sectiondata-v-f10d7c57{background:#0000004d}.section-headerdata-v-f10d7c57{margin-bottom:60px;text-align:center}.section-header h2data-v-f10d7c57{font-size:clamp(2rem,5vw,3rem);margin:16px 0}.section-header pdata-v-f10d7c57{color:var(--color-text-secondary);font-size:1.1rem;margin:0 auto;max-width:600px}.categories-griddata-v-f10d7c57{display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.category-carddata-v-f10d7c57{overflow:hidden;padding:32px;position:relative;text-align:center;transition:all .4s cubic-bezier(.4,0,.2,1)}.category-carddata-v-f10d7c57:hover{border-color:var(--category-color,var(--color-orange-primary));transform:translateY(-8px)}.category-icondata-v-f10d7c57{align-items:center;border-radius:18px;box-shadow:0 8px 30px #0003;display:flex;height:72px;justify-content:center;margin:0 auto 20px;position:relative;transition:all .4s ease;width:72px}.category-icondata-v-f10d7c57:before{background:linear-gradient(135deg,transparent 30%,hsla(0,0%,100%,.4) 50%,transparent 70%);border-radius:20px;content:;inset:-3px;opacity:0;position:absolute;transition:opacity .4s ease}.category-card:hover .category-icondata-v-f10d7c57:before{animation:shimmer-f10d7c57 1.5s ease-in-out infinite;opacity:1}.category-icondata-v-f10d7c57:after{border-radius:18px;box-shadow:0 0 0 0 var(--category-color);content:;inset:0;opacity:0;position:absolute;transition:all .4s ease}.category-card:hover .category-icondata-v-f10d7c57:after{box-shadow:0 0 20px 5px var(--category-color);opacity:.5}.category-card:hover .category-icondata-v-f10d7c57{box-shadow:0 15px 40px #0000004d;transform:scale(1.1) rotate(5deg)}@keyframes shimmer-f10d7c57{0%{transform:translate(-100%) rotate(45deg)}to{transform:translate(100%) rotate(45deg)}}@keyframes float-f10d7c57{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes pulse-glow-f10d7c57{0%,to{box-shadow:0 0 10px var(--category-color)}50%{box-shadow:0 0 25px var(--category-color)}}@keyframes spin-slow-f10d7c57{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.category-icon svgdata-v-f10d7c57{fill:#fff;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2));height:36px;transition:all .4s ease;width:36px}.category-card:hover .category-icon svgdata-v-f10d7c57{filter:drop-shadow(0 4px 8px rgba(0,0,0,.3));transform:scale(1.15)}.category-card:has(.category-icon svgviewBox0 0 24 24d*14.23):hover .category-icon svgdata-v-f10d7c57,.category-card:hover .category-icon svgdata-v-f10d7c57:last-of-type{animation:none}.category-namedata-v-f10d7c57{color:var(--color-text-primary);font-size:1.5rem;margin-bottom:8px}.category-descdata-v-f10d7c57{color:var(--color-text-secondary);font-size:.95rem;line-height:1.6;margin-bottom:16px}.category-arrowdata-v-f10d7c57{align-items:center;background:#ff6b001a;border-radius:50%;display:flex;height:40px;justify-content:center;margin:0 auto;transition:all .3s ease;width:40px}.category-arrow svgdata-v-f10d7c57{height:20px;stroke:var(--color-orange-primary);width:20px}.category-card:hover .category-arrowdata-v-f10d7c57{background:var(--color-orange-primary)}.category-card:hover .category-arrow svgdata-v-f10d7c57{stroke:#fff}.snippets-sectiondata-v-f10d7c57{padding:100px 0}.snippets-griddata-v-f10d7c57{display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(350px,1fr))}.snippet-carddata-v-f10d7c57{padding:24px;transition:all .3s ease}.snippet-carddata-v-f10d7c57:hover{border-color:var(--color-orange-primary);transform:translateY(-4px)}.snippet-headerdata-v-f10d7c57{align-items:center;display:flex;justify-content:space-between;margin-bottom:16px}.snippet-categorydata-v-f10d7c57{border-radius:4px;color:#fff;font-size:.75rem;font-weight:600;padding:4px 12px}.preview-badgedata-v-f10d7c57{align-items:center;color:var(--color-orange-primary);display:flex;font-size:.75rem;gap:6px}.preview-badge svgdata-v-f10d7c57{height:14px;width:14px}.snippet-titledata-v-f10d7c57{color:var(--color-text-primary);font-size:1.25rem;margin-bottom:8px}.snippet-descdata-v-f10d7c57{color:var(--color-text-secondary);font-size:.9rem;line-height:1.6;margin-bottom:16px}.snippet-code-previewdata-v-f10d7c57{background:#0006;border-radius:8px;margin-bottom:16px;max-width:100%;overflow-x:auto;padding:16px}.snippet-code-preview codedata-v-f10d7c57{color:var(--color-text-secondary);display:block;font-family:Fira Code,Monaco,Consolas,monospace;font-size:.8rem;max-height:80px;overflow:hidden;white-space:pre}.snippet-footerdata-v-f10d7c57{align-items:center;display:flex;justify-content:space-between}.snippet-tagsdata-v-f10d7c57{display:flex;gap:8px}.mini-tagdata-v-f10d7c57{background:#ff6b0026;border-radius:4px;color:var(--color-orange-primary);font-size:.7rem;padding:2px 8px}.snippet-datedata-v-f10d7c57{color:var(--color-text-muted);font-size:.8rem}.features-sectiondata-v-f10d7c57{background:#0000004d}.features-griddata-v-f10d7c57{display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.feature-carddata-v-f10d7c57{padding:32px;text-align:center;transition:all .3s ease}.feature-carddata-v-f10d7c57:hover{transform:translateY(-4px)}.feature-icondata-v-f10d7c57{align-items:center;background:linear-gradient(135deg,var(--color-orange-primary),var(--color-orange-dark));border-radius:16px;display:flex;height:60px;justify-content:center;margin:0 auto 20px;width:60px}.feature-icon svgdata-v-f10d7c57{height:28px;stroke:#fff;width:28px}.feature-card h3data-v-f10d7c57{font-size:1.25rem;margin-bottom:12px}.feature-card pdata-v-f10d7c57{color:var(--color-text-secondary);font-size:.95rem;line-height:1.6}.cta-sectiondata-v-f10d7c57{padding:100px 0}.cta-carddata-v-f10d7c57{overflow:hidden;padding:60px;position:relative;text-align:center}.cta-contentdata-v-f10d7c57{position:relative;z-index:1}.cta-content h2data-v-f10d7c57{font-size:clamp(1.75rem,4vw,2.5rem);margin-bottom:16px}.cta-content pdata-v-f10d7c57{color:var(--color-text-secondary);font-size:1.1rem;margin-bottom:32px}.cta-decorationdata-v-f10d7c57{inset:0;pointer-events:none;position:absolute}.cta-orbdata-v-f10d7c57{background:radial-gradient(circle,rgba(255,107,0,.2) 0,transparent 70%);border-radius:50%;filter:blur(60px);height:300px;position:absolute;right:-100px;top:-100px;width:300px}@media(max-width:768px){.hero-sectiondata-v-f10d7c57{padding:100px 0 60px}.hero-statsdata-v-f10d7c57{gap:24px}.stat-dividerdata-v-f10d7c57{display:none}.snippets-griddata-v-f10d7c57{grid-template-columns:1fr}.cta-carddata-v-f10d7c57{padding:40px 24px}}/style>link relstylesheet href/_nuxt/entry.DvMw6qBr.css crossorigin>link relpreload asfetch crossoriginanonymous href/_payload.json?b2a622b4-3268-4bd1-96e7-22aa9ee27aac>link relmodulepreload asscript crossorigin href/_nuxt/Do7KDFVB.js>link relmodulepreload asscript crossorigin href/_nuxt/b3DxMnQV.js>link relmodulepreload asscript crossorigin href/_nuxt/6dqQRpmU.js>link relpreload asfetch fetchprioritylow crossoriginanonymous href/_nuxt/builds/meta/b2a622b4-3268-4bd1-96e7-22aa9ee27aac.json>meta namedescription contentA curated collection of production-ready code snippets for CSS, TypeScript, Vue, and React. Copy, customize, and ship faster.>meta namekeywords contentcode snippets, CSS, TypeScript, Vue, React, frontend, web development, copy paste code>meta nameauthor contentOvvth>meta propertyog:title contentOvvth - Frontend Code Snippets>meta propertyog:description contentProduction-ready code snippets for modern frontend development>meta propertyog:type contentwebsite>meta propertyog:url contenthttps://ovvth.com>meta propertyog:site_name contentOvvth>meta nametwitter:card contentsummary_large_image>meta nametwitter:title contentOvvth - Frontend Code Snippets>meta nametwitter:description contentProduction-ready code snippets for modern frontend development>meta nametheme-color content#FF6B00>link relicon typeimage/svg+xml href/favicon.svg>link relcanonical hrefhttps://ovvth.com>script typemodule src/_nuxt/Do7KDFVB.js crossorigin>/script>/head>body>div id__nuxt>div classapp-wrapper data-v-27b33522>span data-v-27b33522>/span>span data-v-27b33522>/span>header classmain-header data-v-27b33522>div classcontainer header-inner data-v-27b33522>a aria-currentpage href/ classrouter-link-active router-link-exact-active logo-link data-v-27b33522>img src/logo.svg altOvvth classlogo-img data-v-27b33522>/a>nav classmain-nav data-v-27b33522>a aria-currentpage href/ classrouter-link-active router-link-exact-active nav-link data-v-27b33522>Home/a>div classnav-dropdown data-v-27b33522>button classnav-link dropdown-trigger data-v-27b33522> Snippets svg classdropdown-arrow viewBox0 0 24 24 fillnone strokecurrentColor stroke-width2 data-v-27b33522>path dM6 9l6 6 6-6 data-v-27b33522>/path>/svg>/button>div classdropdown-menu data-v-27b33522>a href/category/css classdropdown-item data-v-27b33522>CSS/a>a href/category/typescript classdropdown-item data-v-27b33522>TypeScript/a>a href/category/vue classdropdown-item data-v-27b33522>Vue/a>a href/category/react classdropdown-item data-v-27b33522>React/a>/div>/div>a href/contact-us classnav-link data-v-27b33522>Contact/a>/nav>button classmenu-toggle aria-labelToggle menu data-v-27b33522>span classmenu-bar data-v-27b33522>/span>span classmenu-bar data-v-27b33522>/span>span classmenu-bar data-v-27b33522>/span>/button>/div>/header>main classmain-content data-v-27b33522>div classhome-page data-v-f10d7c57>section classhero-section data-v-f10d7c57>div classhero-bg-effects data-v-f10d7c57>div classhero-orb hero-orb-1 data-v-f10d7c57>/div>div classhero-orb hero-orb-2 data-v-f10d7c57>/div>div classhero-grid-lines data-v-f10d7c57>/div>/div>div classcontainer hero-content data-v-f10d7c57>div classhero-badge energy-badge data-v-f10d7c57>span data-v-f10d7c57>Frontend Code Snippets/span>/div>h1 classhero-title data-v-f10d7c57>span classtext-gradient data-v-f10d7c57>Copy-Paste Ready/span>br data-v-f10d7c57>span data-v-f10d7c57>Code Snippets/span>/h1>p classhero-desc data-v-f10d7c57> A curated collection of production-ready code snippets for CSS, TypeScript, Vue, and React. Copy, customize, and ship faster. /p>div classhero-actions data-v-f10d7c57>a href#snippets classenergy-btn pulse data-v-f10d7c57>svg classbtn-icon viewBox0 0 24 24 fillnone strokecurrentColor stroke-width2 data-v-f10d7c57>path dM10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4 data-v-f10d7c57>/path>/svg> Browse Snippets /a>a href#categories classoutline-btn data-v-f10d7c57> View Categories /a>/div>div classhero-stats data-v-f10d7c57>div classstat-item data-v-f10d7c57>span classstat-number text-gradient data-v-f10d7c57>127+/span>span classstat-label data-v-f10d7c57>Snippets/span>/div>div classstat-divider data-v-f10d7c57>/div>div classstat-item data-v-f10d7c57>span classstat-number text-gradient data-v-f10d7c57>4/span>span classstat-label data-v-f10d7c57>Categories/span>/div>div classstat-divider data-v-f10d7c57>/div>div classstat-item data-v-f10d7c57>span classstat-number text-gradient data-v-f10d7c57>Free/span>span classstat-label data-v-f10d7c57>Forever/span>/div>/div>/div>/section>section idcategories classcategories-section section-padding data-v-f10d7c57>div classcontainer data-v-f10d7c57>div classsection-header data-v-f10d7c57>span classenergy-badge data-v-f10d7c57>Categories/span>h2 data-v-f10d7c57>Explore span classtext-gradient data-v-f10d7c57>Technologies/span>/h2>p data-v-f10d7c57>Choose from our curated collection of frontend code snippets./p>/div>div classcategories-grid data-v-f10d7c57>!---->a href/category/css classcategory-card glass-card holographic style--category-color:#264de4; data-v-f10d7c57>div classcategory-icon stylebackground:#264de4; data-v-f10d7c57>svg viewBox0 0 24 24 fillwhite data-v-f10d7c57>path dM1.5 0h21l-1.91 21.563L11.977 24l-8.565-2.438L1.5 0zm17.09 4.413L5.41 4.41l.213 2.622 10.125.002-.255 2.716h-6.64l.24 2.573h6.182l-.366 3.523-2.91.804-2.956-.81-.188-2.11h-2.61l.29 3.855L12 19.288l5.373-1.53L18.59 4.414z data-v-f10d7c57>/path>/svg>/div>h3 classcategory-name data-v-f10d7c57>CSS/h3>p classcategory-desc data-v-f10d7c57>CSS style snippets with live preview support/p>div classcategory-arrow data-v-f10d7c57>svg viewBox0 0 24 24 fillnone strokecurrentColor stroke-width2 data-v-f10d7c57>path dM5 12h14M12 5l7 7-7 7 data-v-f10d7c57>/path>/svg>/div>/a>a href/category/typescript classcategory-card glass-card holographic style--category-color:#3178c6; data-v-f10d7c57>div classcategory-icon stylebackground:#3178c6; data-v-f10d7c57>svg viewBox0 0 24 24 fillwhite data-v-f10d7c57>path dM1.125 0C.502 0 0 .502 0 1.125v21.75C0 23.498.502 24 1.125 24h21.75c.623 0 1.125-.502 1.125-1.125V1.125C24 .502 23.498 0 22.875 0zm17.363 9.75c.612 0 1.154.037 1.627.111a6.38 6.38 0 0 1 1.306.34v2.458a3.95 3.95 0 0 0-.643-.361 5.093 5.093 0 0 0-.717-.26 5.453 5.453 0 0 0-1.426-.2c-.3 0-.573.028-.819.086a2.1 2.1 0 0 0-.623.242c-.17.104-.3.229-.393.374a.888.888 0 0 0-.14.49c0 .196.053.373.156.529.104.156.252.304.443.444s.423.276.696.41c.273.135.582.274.926.416.47.197.892.407 1.266.628.374.222.695.473.963.753.268.279.472.598.614.957.142.359.214.776.214 1.253 0 .657-.125 1.21-.373 1.656a3.033 3.033 0 0 1-1.012 1.085 4.38 4.38 0 0 1-1.487.596c-.566.12-1.163.18-1.79.18a9.916 9.916 0 0 1-1.84-.164 5.544 5.544 0 0 1-1.512-.493v-2.63a5.033 5.033 0 0 0 3.237 1.2c.333 0 .624-.03.872-.09.249-.06.456-.144.623-.25.166-.108.29-.234.373-.38a1.023 1.023 0 0 0-.074-1.089 2.12 2.12 0 0 0-.537-.5 5.597 5.597 0 0 0-.807-.444 27.72 27.72 0 0 0-1.007-.436c-.918-.383-1.602-.852-2.053-1.405-.45-.553-.676-1.222-.676-2.005 0-.614.123-1.141.369-1.582.246-.441.58-.804 1.004-1.089a4.494 4.494 0 0 1 1.47-.629 7.536 7.536 0 0 1 1.77-.201zm-15.113.188h9.563v2.166H9.506v9.646H6.789v-9.646H3.375z data-v-f10d7c57>/path>/svg>/div>h3 classcategory-name data-v-f10d7c57>TypeScript/h3>p classcategory-desc data-v-f10d7c57>TypeScript utility snippets and helper functions/p>div classcategory-arrow data-v-f10d7c57>svg viewBox0 0 24 24 fillnone strokecurrentColor stroke-width2 data-v-f10d7c57>path dM5 12h14M12 5l7 7-7 7 data-v-f10d7c57>/path>/svg>/div>/a>a href/category/vue classcategory-card glass-card holographic style--category-color:#42b883; data-v-f10d7c57>div classcategory-icon stylebackground:#42b883; data-v-f10d7c57>svg viewBox0 0 24 24 fillwhite data-v-f10d7c57>path dM24,1.61H14.06L12,5.16,9.94,1.61H0L12,22.39ZM12,14.08,5.16,2.23H9.59L12,6.41l2.41-4.18h4.43Z data-v-f10d7c57>/path>/svg>/div>h3 classcategory-name data-v-f10d7c57>Vue/h3>p classcategory-desc data-v-f10d7c57>Vue 3 components and Composition API snippets/p>div classcategory-arrow data-v-f10d7c57>svg viewBox0 0 24 24 fillnone strokecurrentColor stroke-width2 data-v-f10d7c57>path dM5 12h14M12 5l7 7-7 7 data-v-f10d7c57>/path>/svg>/div>/a>a href/category/react classcategory-card glass-card holographic style--category-color:#61dafb; data-v-f10d7c57>div classcategory-icon stylebackground:#61dafb; data-v-f10d7c57>svg viewBox0 0 24 24 fillwhite data-v-f10d7c57>path dM14.23 12.004a2.236 2.236 0 0 1-2.235 2.236 2.236 2.236 0 0 1-2.236-2.236 2.236 2.236 0 0 1 2.235-2.236 2.236 2.236 0 0 1 2.236 2.236zm2.648-10.69c-1.346 0-3.107.96-4.888 2.622-1.78-1.653-3.542-2.602-4.887-2.602-.41 0-.783.093-1.106.278-1.375.793-1.683 3.264-.973 6.365C1.98 8.917 0 10.42 0 12.004c0 1.59 1.99 3.097 5.043 4.03-.704 3.113-.39 5.588.988 6.38.32.187.69.275 1.102.275 1.345 0 3.107-.96 4.888-2.624 1.78 1.654 3.542 2.603 4.887 2.603.41 0 .783-.09 1.106-.275 1.374-.792 1.683-3.263.973-6.365C22.02 15.096 24 13.59 24 12.004c0-1.59-1.99-3.097-5.043-4.032.704-3.11.39-5.587-.988-6.38-.318-.184-.688-.277-1.092-.278zm-.005 1.09v.006c.225 0 .406.044.558.127.666.382.955 1.835.73 3.704-.054.46-.142.945-.25 1.44-.96-.236-2.006-.417-3.107-.534-.66-.905-1.345-1.727-2.035-2.447 1.592-1.48 3.087-2.292 4.105-2.295zm-9.77.02c1.012 0 2.514.808 4.11 2.28-.686.72-1.37 1.537-2.02 2.442-1.107.117-2.154.298-3.113.538-.112-.49-.195-.964-.254-1.42-.23-1.868.054-3.32.714-3.707.19-.09.4-.127.563-.132zm4.882 3.05c.455.468.91.992 1.36 1.564-.44-.02-.89-.034-1.345-.034-.46 0-.915.01-1.36.034.44-.572.895-1.096 1.345-1.565zM12 8.1c.74 0 1.477.034 2.202.093.406.582.802 1.203 1.183 1.86.372.64.71 1.29 1.018 1.946-.308.655-.646 1.31-1.013 1.95-.38.66-.773 1.288-1.18 1.87-.728.063-1.466.098-2.21.098-.74 0-1.477-.035-2.202-.093-.406-.582-.802-1.204-1.183-1.86-.372-.64-.71-1.29-1.018-1.946.303-.657.646-1.313 1.013-1.954.38-.66.773-1.286 1.18-1.868.728-.064 1.466-.098 2.21-.098zm-3.635.254c-.24.377-.48.763-.704 1.16-.225.39-.435.782-.635 1.174-.265-.656-.49-1.31-.676-1.947.64-.15 1.315-.283 2.015-.386zm7.26 0c.695.103 1.365.23 2.006.387-.18.632-.405 1.282-.66 1.933-.2-.39-.41-.783-.64-1.174-.225-.392-.465-.774-.705-1.146zm3.063.675c.484.15.944.317 1.375.498 1.732.74 2.852 1.708 2.852 2.476-.005.768-1.125 1.74-2.857 2.475-.42.18-.88.342-1.355.493-.28-.958-.646-1.956-1.1-2.98.45-1.017.81-2.01 1.085-2.964zm-13.395.004c.278.96.645 1.957 1.1 2.98-.45 1.017-.812 2.01-1.086 2.964-.484-.15-.944-.318-1.37-.5-1.732-.737-2.852-1.706-2.852-2.474 0-.768 1.12-1.742 2.852-2.476.42-.18.88-.342 1.356-.494zm11.678 4.28c.265.657.49 1.312.676 1.948-.64.157-1.316.29-2.016.39.24-.375.48-.762.705-1.158.225-.39.435-.788.636-1.18zm-9.945.02c.2.392.41.783.64 1.175.23.39.465.772.705 1.143-.695-.102-1.365-.23-2.006-.386.18-.63.406-1.282.66-1.933zM17.92 16.32c.112.493.2.968.254 1.423.23 1.868-.054 3.32-.714 3.708-.147.09-.338.128-.563.128-1.012 0-2.514-.807-4.11-2.28.686-.72 1.37-1.536 2.02-2.44 1.107-.118 2.154-.3 3.113-.54zm-11.83.01c.96.234 2.006.415 3.107.532.66.905 1.345 1.727 2.035 2.446-1.595 1.483-3.092 2.295-4.11 2.295-.22-.005-.406-.05-.553-.132-.666-.38-.955-1.834-.73-3.703.054-.46.142-.944.25-1.438zm4.56.64c.44.02.89.034 1.345.034.46 0 .915-.01 1.36-.034-.44.572-.895 1.095-1.345 1.565-.455-.47-.91-.993-1.36-1.565z data-v-f10d7c57>/path>/svg>/div>h3 classcategory-name data-v-f10d7c57>React/h3>p classcategory-desc data-v-f10d7c57>React Hooks and component snippets/p>div classcategory-arrow data-v-f10d7c57>svg viewBox0 0 24 24 fillnone strokecurrentColor stroke-width2 data-v-f10d7c57>path dM5 12h14M12 5l7 7-7 7 data-v-f10d7c57>/path>/svg>/div>/a>!---->/div>/div>/section>section idsnippets classsnippets-section section-padding data-v-f10d7c57>div classcontainer data-v-f10d7c57>div classsection-header data-v-f10d7c57>span classenergy-badge data-v-f10d7c57>Snippets/span>h2 data-v-f10d7c57>Latest span classtext-gradient data-v-f10d7c57>Code/span> Snippets/h2>p data-v-f10d7c57>Production-ready code snippets you can copy and use immediately./p>/div>div classsnippets-grid data-v-f10d7c57>!---->a href/snippet/css-glassmorphism-card classsnippet-card glass-card data-v-f10d7c57>div classsnippet-header data-v-f10d7c57>span classsnippet-category tag stylebackground:#264de4; data-v-f10d7c57>CSS/span>span classpreview-badge data-v-f10d7c57>svg viewBox0 0 24 24 fillnone strokecurrentColor stroke-width2 data-v-f10d7c57>path dM1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z data-v-f10d7c57>/path>circle cx12 cy12 r3 data-v-f10d7c57>/circle>/svg> Live Preview /span>/div>h3 classsnippet-title data-v-f10d7c57>Glassmorphism Card/h3>p classsnippet-desc data-v-f10d7c57>Modern glass-effect card component using backdrop-filter for stunning UI design/p>div classsnippet-code-preview data-v-f10d7c57>code data-v-f10d7c57>.glass-card { background: rgba(255, 255, 255, 0.1); backdrop-filter: blur(10px);.../code>/div>div classsnippet-footer data-v-f10d7c57>div classsnippet-tags data-v-f10d7c57>!---->span classmini-tag data-v-f10d7c57>CSS3/span>span classmini-tag data-v-f10d7c57>Glassmorphism/span>!---->/div>span classsnippet-date data-v-f10d7c57>Dec 12, 2024/span>/div>/a>a href/snippet/css-neon-button classsnippet-card glass-card data-v-f10d7c57>div classsnippet-header data-v-f10d7c57>span classsnippet-category tag stylebackground:#264de4; data-v-f10d7c57>CSS/span>span classpreview-badge data-v-f10d7c57>svg viewBox0 0 24 24 fillnone strokecurrentColor stroke-width2 data-v-f10d7c57>path dM1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z data-v-f10d7c57>/path>circle cx12 cy12 r3 data-v-f10d7c57>/circle>/svg> Live Preview /span>/div>h3 classsnippet-title data-v-f10d7c57>Neon Glow Button/h3>p classsnippet-desc data-v-f10d7c57>Eye-catching neon glow button with hover animation effects/p>div classsnippet-code-preview data-v-f10d7c57>code data-v-f10d7c57>.neon-button { padding: 12px 32px; font-size: 18px;.../code>/div>div classsnippet-footer data-v-f10d7c57>div classsnippet-tags data-v-f10d7c57>!---->span classmini-tag data-v-f10d7c57>CSS3/span>span classmini-tag data-v-f10d7c57>Neon/span>!---->/div>span classsnippet-date data-v-f10d7c57>Dec 12, 2024/span>/div>/a>a href/snippet/css-3d-text classsnippet-card glass-card data-v-f10d7c57>div classsnippet-header data-v-f10d7c57>span classsnippet-category tag stylebackground:#264de4; data-v-f10d7c57>CSS/span>span classpreview-badge data-v-f10d7c57>svg viewBox0 0 24 24 fillnone strokecurrentColor stroke-width2 data-v-f10d7c57>path dM1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z data-v-f10d7c57>/path>circle cx12 cy12 r3 data-v-f10d7c57>/circle>/svg> Live Preview /span>/div>h3 classsnippet-title data-v-f10d7c57>3D Text Effect/h3>p classsnippet-desc data-v-f10d7c57>Stunning 3D text with layered shadows and perspective/p>div classsnippet-code-preview data-v-f10d7c57>code data-v-f10d7c57>.text-3d { font-size: 72px; font-weight: 900;.../code>/div>div classsnippet-footer data-v-f10d7c57>div classsnippet-tags data-v-f10d7c57>!---->span classmini-tag data-v-f10d7c57>CSS3/span>span classmini-tag data-v-f10d7c57>3D/span>!---->/div>span classsnippet-date data-v-f10d7c57>Dec 12, 2024/span>/div>/a>a href/snippet/css-gradient-border classsnippet-card glass-card data-v-f10d7c57>div classsnippet-header data-v-f10d7c57>span classsnippet-category tag stylebackground:#264de4; data-v-f10d7c57>CSS/span>span classpreview-badge data-v-f10d7c57>svg viewBox0 0 24 24 fillnone strokecurrentColor stroke-width2 data-v-f10d7c57>path dM1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z data-v-f10d7c57>/path>circle cx12 cy12 r3 data-v-f10d7c57>/circle>/svg> Live Preview /span>/div>h3 classsnippet-title data-v-f10d7c57>Gradient Border Card/h3>p classsnippet-desc data-v-f10d7c57>Card with beautiful gradient border using CSS pseudo-elements/p>div classsnippet-code-preview data-v-f10d7c57>code data-v-f10d7c57>.gradient-border-card { position: relative; width: 300px;.../code>/div>div classsnippet-footer data-v-f10d7c57>div classsnippet-tags data-v-f10d7c57>!---->span classmini-tag data-v-f10d7c57>CSS3/span>span classmini-tag data-v-f10d7c57>Gradient/span>!---->/div>span classsnippet-date data-v-f10d7c57>Dec 12, 2024/span>/div>/a>a href/snippet/css-pulse-animation classsnippet-card glass-card data-v-f10d7c57>div classsnippet-header data-v-f10d7c57>span classsnippet-category tag stylebackground:#264de4; data-v-f10d7c57>CSS/span>span classpreview-badge data-v-f10d7c57>svg viewBox0 0 24 24 fillnone strokecurrentColor stroke-width2 data-v-f10d7c57>path dM1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z data-v-f10d7c57>/path>circle cx12 cy12 r3 data-v-f10d7c57>/circle>/svg> Live Preview /span>/div>h3 classsnippet-title data-v-f10d7c57>Pulse Animation Effect/h3>p classsnippet-desc data-v-f10d7c57>Smooth pulse animation for UI elements like notifications or buttons/p>div classsnippet-code-preview data-v-f10d7c57>code data-v-f10d7c57>.pulse-effect { width: 60px; height: 60px;.../code>/div>div classsnippet-footer data-v-f10d7c57>div classsnippet-tags data-v-f10d7c57>!---->span classmini-tag data-v-f10d7c57>CSS3/span>span classmini-tag data-v-f10d7c57>Animation/span>!---->/div>span classsnippet-date data-v-f10d7c57>Dec 12, 2024/span>/div>/a>a href/snippet/css-fluid-animation classsnippet-card glass-card data-v-f10d7c57>div classsnippet-header data-v-f10d7c57>span classsnippet-category tag stylebackground:#264de4; data-v-f10d7c57>CSS/span>span classpreview-badge data-v-f10d7c57>svg viewBox0 0 24 24 fillnone strokecurrentColor stroke-width2 data-v-f10d7c57>path dM1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z data-v-f10d7c57>/path>circle cx12 cy12 r3 data-v-f10d7c57>/circle>/svg> Live Preview /span>/div>h3 classsnippet-title data-v-f10d7c57>Fluid Wave Animation/h3>p classsnippet-desc data-v-f10d7c57>Smooth fluid wave animation using CSS keyframes and transforms/p>div classsnippet-code-preview data-v-f10d7c57>code data-v-f10d7c57>.fluid-wave { width: 300px; height: 150px;.../code>/div>div classsnippet-footer data-v-f10d7c57>div classsnippet-tags data-v-f10d7c57>!---->span classmini-tag data-v-f10d7c57>CSS3/span>span classmini-tag data-v-f10d7c57>Animation/span>!---->/div>span classsnippet-date data-v-f10d7c57>Dec 12, 2024/span>/div>/a>!---->/div>/div>/section>section classfeatures-section section-padding data-v-f10d7c57>div classcontainer data-v-f10d7c57>div classsection-header data-v-f10d7c57>span classenergy-badge data-v-f10d7c57>Why Ovvth/span>h2 data-v-f10d7c57>Your span classtext-gradient data-v-f10d7c57>Coding/span> Advantage/h2>/div>div classfeatures-grid data-v-f10d7c57>div classfeature-card glass-card data-v-f10d7c57>div classfeature-icon data-v-f10d7c57>svg viewBox0 0 24 24 fillnone strokecurrentColor stroke-width2 data-v-f10d7c57>path dM8 5H6a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2v-1M8 5a2 2 0 002 2h2a2 2 0 002-2M8 5a2 2 0 012-2h2a2 2 0 012 2m0 0h2a2 2 0 012 2v3m2 4H10m0 0l3-3m-3 3l3 3 data-v-f10d7c57>/path>/svg>/div>h3 data-v-f10d7c57>Copy & Paste/h3>p data-v-f10d7c57>All snippets are ready to use. Just copy and paste into your project./p>/div>div classfeature-card glass-card data-v-f10d7c57>div classfeature-icon data-v-f10d7c57>svg viewBox0 0 24 24 fillnone strokecurrentColor stroke-width2 data-v-f10d7c57>path dM1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z data-v-f10d7c57>/path>circle cx12 cy12 r3 data-v-f10d7c57>/circle>/svg>/div>h3 data-v-f10d7c57>Live Preview/h3>p data-v-f10d7c57>CSS snippets come with live preview so you can see the effect instantly./p>/div>div classfeature-card glass-card data-v-f10d7c57>div classfeature-icon data-v-f10d7c57>svg viewBox0 0 24 24 fillnone strokecurrentColor stroke-width2 data-v-f10d7c57>path dM10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4 data-v-f10d7c57>/path>/svg>/div>h3 data-v-f10d7c57>TypeScript Ready/h3>p data-v-f10d7c57>All code snippets are written with TypeScript for type safety./p>/div>div classfeature-card glass-card data-v-f10d7c57>div classfeature-icon data-v-f10d7c57>svg viewBox0 0 24 24 fillnone strokecurrentColor stroke-width2 data-v-f10d7c57>path dM4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15 data-v-f10d7c57>/path>/svg>/div>h3 data-v-f10d7c57>Always Updated/h3>p data-v-f10d7c57>Snippets are regularly updated to follow best practices./p>/div>/div>/div>/section>section classcta-section data-v-f10d7c57>div classcontainer data-v-f10d7c57>div classcta-card glass-card data-v-f10d7c57>div classcta-content data-v-f10d7c57>h2 data-v-f10d7c57>Ready to span classtext-gradient data-v-f10d7c57>Code Faster?/span>/h2>p data-v-f10d7c57>Start using our production-ready snippets in your projects today./p>a href#snippets classenergy-btn pulse data-v-f10d7c57> Browse All Snippets svg classbtn-icon-right viewBox0 0 24 24 fillnone strokecurrentColor stroke-width2 data-v-f10d7c57>path dM13 7l5 5m0 0l-5 5m5-5H6 data-v-f10d7c57>/path>/svg>/a>/div>div classcta-decoration data-v-f10d7c57>div classcta-orb data-v-f10d7c57>/div>/div>/div>/div>/section>/div>/main>footer classmain-footer data-v-27b33522>div classcontainer data-v-27b33522>div classfooter-grid data-v-27b33522>div classfooter-brand data-v-27b33522>img src/logo.svg altOvvth classfooter-logo data-v-27b33522>p classfooter-desc data-v-27b33522>Your go-to resource for production-ready frontend code snippets. Copy, customize, and ship faster./p>/div>div classfooter-links data-v-27b33522>h4 classfooter-title data-v-27b33522>Snippets/h4>a href/category/css class data-v-27b33522>CSS/a>a href/category/typescript class data-v-27b33522>TypeScript/a>a href/category/vue class data-v-27b33522>Vue/a>a href/category/react class data-v-27b33522>React/a>/div>div classfooter-links data-v-27b33522>h4 classfooter-title data-v-27b33522>Legal/h4>a href/contact-us class data-v-27b33522>Contact Us/a>a href/privacy-policy class data-v-27b33522>Privacy Policy/a>a href/terms-of-service class data-v-27b33522>Terms of Service/a>a href/cookies-policy class data-v-27b33522>Cookies Policy/a>/div>/div>div classfooter-bottom data-v-27b33522>p data-v-27b33522>© 2025 Ovvth. All rights reserved./p>p classfooter-domain data-v-27b33522>ovvth.com/p>/div>/div>/footer>/div>/div>div idteleports>/div>script typeapplication/json data-nuxt-datanuxt-app data-ssrtrue id__NUXT_DATA__ data-src/_payload.json?b2a622b4-3268-4bd1-96e7-22aa9ee27aac>{state:1,once:3,_errors:4,serverRendered:7,path:8,prerenderedAt:9},Reactive,2,{},Set,ShallowReactive,5,{snippets:6,categories:6},null,true,/,1765529598366/script>script>window.__NUXT__{};window.__NUXT__.config{public:{},app:{baseURL:/,buildId:b2a622b4-3268-4bd1-96e7-22aa9ee27aac,buildAssetsDir:/_nuxt/,cdnURL:}}/script>/body>/html>
View on OTX
|
View on ThreatMiner
Please enable JavaScript to view the
comments powered by Disqus.
Data with thanks to
AlienVault OTX
,
VirusTotal
,
Malwr
and
others
. [
Sitemap
]