Home
QQ-VVN
about us simple

about us simple

This tailwind example is contributed by QQ-VVN, on 11-May-2025. Component is made with Tailwind CSS v3. It is responsive. similar terms for this example is about me

About us

Author QQ-VVN

703

Fork Fullscreen

<div class="bg-white dark:bg-gray-800 flex justify-center items-center w-screen h-screen p-5">
 <section class="min-h-screen px-4 py-14 text-white font-sans">
    <div class="max-w-6xl mx-auto">
        <div class="max-w-3xl mx-auto text-center mb-12 relative">
            <div class="absolute inset-0 bg-gradient-to-r from-blue-600/20 via-purple-600/20 to-indigo-600/20 blur-3xl opacity-30 rounded-full"></div>
            <h1 class="text-4xl md:text-5xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-blue-400 to-indigo-500 mb-4">Hakkımızda</h1>
            <div class="w-24 h-1 bg-gradient-to-r from-blue-500 to-indigo-500 mx-auto mb-6 rounded-full"></div>
            <p class="text-lg text-gray-300 relative z-10">
                Mütevazı başlangıçlardan oyun dünyasında bir oyun değiştirici olmaya — 2015'ten beri en son teknoloji araçlar, eklentiler ve çözümler üretiyoruz. Sadece ürün geliştirmiyoruz; oyunun geleceğini şekillendiren deneyimler yaratıyoruz.
            </p>
        </div>
        <div class="grid grid-cols-1 md:grid-cols-2 gap-8 mb-16">
            <div class="glass-effect shimmer rounded-xl p-8 feature-card">
                <div class="w-16 h-16 bg-gradient-to-br from-blue-400/20 to-blue-600/20 rounded-full flex items-center justify-center mb-6">
                    <i class="fas fa-rocket text-blue-400 text-2xl"></i>
                </div>
                <h3 class="text-2xl font-bold text-white mb-4">Yolculuğumuz</h3>
                <p class="text-gray-300">
                    2015'te büyük bir vizyona sahip küçük bir ekip olarak başlayan serüvenimiz, şimdi yaratıcılık, teknoloji ve yeniliğin merkezi haline geldi. Misyonumuz her zaman netti: oyun dünyasında mümkün olanın sınırlarını zorlayan araçlar yaratmak.
                </p>
                <p class="text-gray-300 mt-4">
                    Üstlendiğimiz her projede, hem geliştiriciler hem de oyuncular için deneyimi yükseltmeyi hedefliyoruz. Çözümlerimiz sadece araç değil; yaratıcılığın katalizörleridir.
                </p>
            </div>
            <div class="glass-effect shimmer rounded-xl p-8 feature-card">
                <div class="w-16 h-16 bg-gradient-to-br from-purple-400/20 to-purple-600/20 rounded-full flex items-center justify-center mb-6">
                    <i class="fas fa-lightbulb text-purple-400 text-2xl"></i>
                </div>
                <h3 class="text-2xl font-bold text-white mb-4">Özünde Yenilik</h3>
                <p class="text-gray-300">
                    Yenilik bizim için sadece bir sözcük değil — şirketimizin kalp atışıdır. Geliştirdiğimiz her ürün ilham vermek, meydan okumak ve dönüştürmek için tasarlanmıştır. Vizyoner ve uzman ekibimiz sürekli olarak sınırları zorluyor.
                </p>
                <p class="text-gray-300 mt-4">
                    En küçük detayı mükemmelleştirirken veya tamamen yeni bir şey yaratırken, odak noktamız her zaman kalite, performans ve kullanıcı deneyimidir. Sadece trendi takip etmiyoruz; trendi yaratıyoruz.
                </p>
            </div>
        </div>
        <div class="glass-effect shimmer rounded-xl p-8 mb-16">
            <div class="grid grid-cols-2 md:grid-cols-4 gap-6 text-center">
                <div class="p-4">
                    <div class="text-4xl font-bold text-blue-400 mb-2">8+</div>
                    <div class="text-gray-400">Yıllık Deneyim</div>
                </div>
                <div class="p-4">
                    <div class="text-4xl font-bold text-blue-400 mb-2">50k+</div>
                    <div class="text-gray-400">Mutlu Kullanıcı</div>
                </div>
                <div class="p-4">
                    <div class="text-4xl font-bold text-blue-400 mb-2">99.9%</div>
                    <div class="text-gray-400">Çalışma Süresi</div>
                </div>
                <div class="p-4">
                    <div class="text-4xl font-bold text-blue-400 mb-2">7/24</div>
                    <div class="text-gray-400">Destek</div>
                </div>
            </div>
        </div>
        <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
            <div class="glass-effect shimmer rounded-xl p-8 feature-card">
                <div class="w-16 h-16 bg-gradient-to-br from-indigo-400/20 to-indigo-600/20 rounded-full flex items-center justify-center mb-6">
                    <i class="fas fa-clock text-indigo-400 text-2xl"></i>
                </div>
                <h3 class="text-2xl font-bold text-white mb-4">Gelecek Şimdi</h3>
                <p class="text-gray-300">
                    Oyunun geleceği sınırsız ve vizyonumuz da öyle. Büyümeye ve gelişmeye devam ederken, gelecekte olacakları şekillendirmeye her zamankinden daha kararlıyız. Ekibimiz sürekli yenilik yapıyor, araştırıyor ve işbirliği yapıyor.
                </p>
                <p class="text-gray-300 mt-4">
                    Sadece yazılım geliştirmiyoruz; deneyimler şekillendiriyoruz. Odak noktamız, geliştiricileri güçlendiren, oyun deneyimini geliştiren ve interaktif eğlencenin geleceğini sunan yeni nesil oyun araçları yaratmak.
                </p>
            </div>
            <div class="glass-effect shimmer rounded-xl p-8 feature-card">
                <div class="w-16 h-16 bg-gradient-to-br from-green-400/20 to-green-600/20 rounded-full flex items-center justify-center mb-6">
                    <i class="fas fa-check-circle text-green-400 text-2xl"></i>
                </div>
                <h3 class="text-2xl font-bold text-white mb-4">Neden Biz?</h3>
                <p class="text-gray-300">
                    Oyun dünyasının sürekli değiştiği bir ortamda, sadece ürün değil — bir ortaklık sunuyoruz. Oyun dünyasının rekabetçi, hızlı tempolu ve sürekli gelişen bir yapıya sahip olduğunu anlıyoruz.
                </p>
                <p class="text-gray-300 mt-4">
                    İş akışınızı düzene sokmak isteyen bir geliştirici veya deneyiminizi üst seviyeye çıkarmak isteyen bir oyuncu olun, yanınızdayız. Ürünlerimiz tek bir hedefle tasarlandı: en iyi işinizi yapmanızı, en iyi oyununuzu oynamanızı ve en iyi deneyiminizi yaratmanızı sağlamak.
                </p>
            </div>
        </div>
        <div class="glass-effect shimmer rounded-xl p-8 mt-16">
            <h3 class="text-2xl font-bold text-white mb-8 text-center">Değerlerimiz</h3>
            <div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-6">
                <div class="text-center p-4">
                    <div class="w-14 h-14 mx-auto bg-gradient-to-br from-blue-400/20 to-blue-600/20 rounded-full flex items-center justify-center mb-4">
                        <i class="fas fa-shield-alt text-blue-400 text-xl"></i>
                    </div>
                    <h4 class="text-lg font-semibold text-white mb-2">Güvenlik</h4>
                    <p class="text-gray-400 text-sm">En son güvenlik önlemleriyle güvenliğinizi ve gizliliğinizi önceliklendiriyoruz</p>
                </div>
                <div class="text-center p-4">
                    <div class="w-14 h-14 mx-auto bg-gradient-to-br from-purple-400/20 to-purple-600/20 rounded-full flex items-center justify-center mb-4">
                        <i class="fas fa-tachometer-alt text-purple-400 text-xl"></i>
                    </div>
                    <h4 class="text-lg font-semibold text-white mb-2">Performans</h4>
                    <p class="text-gray-400 text-sm">Araçlarımız minimum sistem etkisiyle maksimum performans için optimize edilmiştir</p>
                </div>
                <div class="text-center p-4">
                    <div class="w-14 h-14 mx-auto bg-gradient-to-br from-green-400/20 to-green-600/20 rounded-full flex items-center justify-center mb-4">
                        <i class="fas fa-headset text-green-400 text-xl"></i>
                    </div>
                    <h4 class="text-lg font-semibold text-white mb-2">Destek</h4>
                    <p class="text-gray-400 text-sm">Özel ekibimiz her türlü sorunuzda size yardımcı olmaya hazır</p>
                </div>
            </div>
        </div>
    </div>
</section>
</div>

Related Examples

basichtml
this is basic html

Author:
Anonymous

7 months ago

427
about page
about page

Author:
Omer fils ELENGA

2 months ago

246
About us card

Author:
Sienna

3 years ago

11.8k
Responsive portfolio with dark mode
responsive and support dark mode .portfolio website

Author:
ABDESLAMI ACHRAF

1 year ago

3.7k
portfolio
Complete Portfolio UI Kit with hero, about, skills, projects, testimonials, contact form, and footer. Fully responsive and dark mode supported using Tailwind CSS.

Author:
Lekhraj Ghimire

7 months ago

825
About Us Component

Author:
KULDEEP

7 months ago

1.3k
Stylish Mobile-First Navigation Bar Using Tailwind
This project showcases a sleek, fixed-top responsive navigation bar crafted with Tailwind CSS. Featuring a vibrant gradient background, a bold uppercase logo, and smooth pink hover effects, it adapts beautifully across devices. On desktop, the navigation links appear horizontally with ample spacing, while on mobile, a hamburger menu toggles a stylish dropdown with rounded corners and subtle shadows. The navbar’s semi-transparent backdrop with blur adds a modern glassmorphism touch, making it perfect for contemporary web designs.

Author:
Bonimater

8 months ago

690
Innovative Rwanda-Canada Transport Services Website
Innovative Rwanda-Canada Transport Services Website

Author:
Code Master(Mfuranziza Dusabe Hamza)

5 months ago

478
User about me / introduction card
About me card with an image and a short introduction

Author:
Abigail

2 years ago

10.3k
ArtoGallery
Explore a curated selection of contemporary and classic artwork, connecting collectors and creators in an inspiring online space.

Author:
ORGIN_DREAMS

8 months ago

1.2k
canvas fully covers
canvas fully covers

Author:
ABDESLAMI ACHRAF

1 year ago

4k
Coming Soon Countdown Section – Animated & Responsive
A beautifully designed "Coming Soon" landing section built with Tailwind CSS and Alpine.js, perfect for startups, SaaS platforms, and product launches. This component features a live countdown timer, smooth fade-in animations, and floating gradient effects for a futuristic, engaging look. The layout adapts seamlessly to all screen sizes and supports dark mode, creating a professional pre-launch experience that builds anticipation and excitement. ✨ Key Features ⏳ Dynamic countdown timer (days, hours, minutes, seconds) 🎨 Animated gradient orbs for a vibrant background effect 🌙 Dark mode support included 💨 Smooth entrance animations using Alpine.js 📱 Fully responsive design for all devices 🔗 Social media icons to keep your audience connected 💡 Perfect for: Coming Soon or Under Construction pages Product and SaaS pre-launch sites Portfolio or agency landing pages Event or app launch countdowns

Author:
wavy kits

4 months ago

663

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components