All Prompts
All Prompts
sectionfeaturetailwindcopywritinglandingglassmorphism
Futuristic Mission Statement Text Block
Текстовый блок "Миссия" в стиле Glassmorphism. Идеален для заголовков, позиционирования компании на современных лендингах. Tailwind CSS.
Prompt
<html __gchrome_remoteframetoken="a15c2186bfa2c4901cdb2190b2435f2c">
<head>
<script src="https://cdn.tailwindcss.com"></script>
<meta name="disabled-font-classes"
content="font-geist,font-roboto,font-montserrat,font-poppins,font-playfair,font-instrument-serif,font-merriweather,font-bricolage,font-jakarta,font-space-grotesk,font-work-sans,font-pt-serif,font-geist-mono,font-space-mono,font-quicksand,font-nunito,font-newsreader,font-google-sans-flex,font-oswald,font-dm-sans,font-cormorant">
<style id="aura-editor-visibility-style">
.invisible {
visibility: hidden !important;
}
</style>
<style id="cms-loading-styles">
@keyframes cms-shimmer {
0% {
background-position: -200% 0;
}
100% {
background-position: 200% 0;
}
}
.cms-loading {
position: relative;
color: transparent !important;
background-image: none !important;
background-color: transparent !important;
background: linear-gradient(90deg,
rgba(128, 128, 128, 0.1) 25%,
rgba(128, 128, 128, 0.2) 50%,
rgba(128, 128, 128, 0.1) 75%) !important;
background-size: 200% 100% !important;
animation: cms-shimmer 1.5s infinite !important;
border-radius: 12px;
min-height: 1em;
min-width: 3em;
overflow: hidden;
}
</style>
<link id="all-fonts-link-font-manrope" rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;500;600;700;800&display=swap">
<style id="all-fonts-style-font-manrope">
.font-manrope {
font-family: 'Manrope', sans-serif !important;
}
</style>
</head>
<body class="bg-black min-h-screen w-full flex items-center justify-center p-4">
<div
class="flex flex-col h-fit w-fit max-w-[1400px] mx-auto lg:px-12 selection:bg-[#FACC15] selection:text-black overflow-hidden transition-all duration-500 group bg-gray-950/60 z-20 border-white/10 border rounded-3xl ring-white/5 ring-1 relative shadow-2xl backdrop-blur-xl py-12 px-6 justify-between">
<div class="absolute inset-0 pointer-events-none z-0">
<div
class="absolute inset-0 bg-[linear-gradient(to_right,rgba(255,255,255,0.02)_1px,transparent_1px),linear-gradient(to_bottom,rgba(255,255,255,0.02)_1px,transparent_1px)] bg-[size:4rem_4rem] [mask-image:radial-gradient(ellipse_80%_80%_at_50%_50%,black_40%,transparent_100%)] opacity-50">
</div>
<div
class="absolute top-[-20%] left-1/2 -translate-x-1/2 w-[80%] h-[600px] bg-[#FACC15]/5 blur-[120px] rounded-full mix-blend-screen opacity-60">
</div>
<div
class="absolute bottom-0 right-0 w-[500px] h-[500px] bg-[#FACC15]/5 blur-[100px] rounded-full mix-blend-screen opacity-40">
</div>
</div>
<div class="flex w-full justify-start relative z-10 mb-8">
<div
class="inline-flex items-center gap-2 px-4 py-1.5 rounded-full border border-white/10 bg-white/5 backdrop-blur-md shadow-lg shadow-black/20 hover:border-[#FACC15]/30 transition-colors cursor-default">
<div class="w-1.5 h-1.5 rounded-full bg-[#FACC15] shadow-[0_0_8px_#FACC15] animate-pulse"></div>
<span class="text-[10px] font-mono uppercase tracking-[0.2em] text-neutral-400 font-sans">Mission Protocol</span>
</div>
</div>
<div class="relative z-10">
<h2
class="leading-[1.1] select-none transition-all duration-700 text-3xl font-medium text-white/20 tracking-tighter font-manrope md:text-5xl lg:text-6xl xl:text-[5.5rem]">
<span class="font-medium text-white font-manrope drop-shadow-lg">We are a systems architecture firm</span>
dedicated to transforming how the world's elite
<span class="hover:text-[#FACC15] hover:shadow-[0_0_30px_rgba(250,204,21,0.4)] hover:scale-[1.02] transition-all duration-300 cursor-default inline-block origin-bottom font-medium text-white font-manrope">structure reality</span>.
With a collective of data engineers and behavioral scientists, we build
<span class="text-white hover:text-[#FACC15] hover:shadow-[0_0_30px_rgba(250,204,21,0.4)] hover:scale-[1.02] transition-all duration-300 cursor-default inline-block origin-bottom font-manrope font-medium">operating systems</span>
that empower
<span class="text-white hover:text-[#FACC15] hover:shadow-[0_0_30px_rgba(250,204,21,0.4)] hover:scale-[1.02] transition-all duration-300 cursor-default inline-block origin-bottom font-manrope font-medium">sovereign individuals</span>
to audit, optimize, and scale their output with
<span class="text-white hover:text-[#FACC15] hover:shadow-[0_0_30px_rgba(250,204,21,0.4)] hover:scale-[1.02] transition-all duration-300 cursor-default inline-block origin-bottom font-manrope font-medium">algorithmic precision</span>.
</h2>
</div>
</div>
</body>
</html>