müminbiri
- 13 Ağu 2025
- 1,328 Mesaj
- TIM Görevleri
- 1
TURKHACKS'a Özel Index
Esselamun Aleykum Değerli Meclis Allah'ın Rahmeti Ve Bereketi Üzerimize Olsun.Bu index sayfası, TURKHACKS için özel olarak hazırlanmış,
- Matrix Rain (Canvas) — arkada gerçek zamanlı karakter yağmuru (Karaktersiz Köpekler İçin)
- Glitch Text Efekti — 3 katmanlı bozulma animasyonu
- Neon Pulse & Scanlines — CRT tarama çizgileri ve ışıma efektleri
- Toggle Message — orijinal uzun mesajın animasyonlu açılır/kapanır hali
- Responsive Tasarım — tüm ekran boyutlarına uyum
- Profesyonel Sunum — sade defaceden operasyonel POC seviyesine yükseltme
İndexin kod tasarımı tamamen kendim tarafından TURKHACK üyeleri için kodlanmıştır.
Üyeler misyon ve kullanım dahilinde gerekli düzenlemeleri yapmakta özgürdür.
Değiştirilebilir tüm alanlar kaynak kodlarda yorum satırları ile belirtilmiştir.
İndexin görsel tasarımları bana aittir.
Lanet İsrail'in Tüm Hacklediğimiz Sitelerine Bunu Koyunuz Lütfen Elimden Gelen Tek Şey Bu Sizler Gibi Hacklemeyi Bilsem Gece Uyumadan Tüm Sitelerini Patlatmak İçin Uykusuz Olurdum Ve Onlara Allahın Tokadını Vururdum Bunada Şükür İndex Te Ekrana Tıkladığımız Her An Gazzedeki Kardeşlerimizin Acılarına Ortak Olupta Onlar İçin Dua Edelim Kendimizi De Islah Edelim ki Buraya Kadar Olan Her Durum Bizim Yapmadıklarımızdan Dolayıdır Ders Çıkaralım Şimdiden Teşekkürler.
@Ebu Ubeyde @ZahirCoder @Graves @CW-ommah Sizlerede Ayrı Ayrı Çok Teşekkür Ediyorum Abilerim Kardeşlerim Allah Sizi Kazadan Beladan Korusun İnşallah
https://www.turkhacks.com/konu/turkhacks-ozel-index-1-hacktivism-style.249719/ @QARAKURT Hocamdan da Yaptığı İndex Fikrinden Yardım Aldım Teşekkürler.
Design : müminbiri
HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>TURKHACKS was here !</title>
<link rel="icon" href="https://i.hizliresim.com/qyopfbf.png" type="image/png">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Staatliches&family=Kosugi+Maru&family=Philosopher:ital,wght@0,400;0,700;1,400;1,700&family=Orbitron:wght@400;700;900&family=JetBrains+Mono:wght@300;400;700&family=Bungee&display=swap" rel="stylesheet">
<style>
*, *::before, *::after {
box-sizing: border-box;
margin: 0;
padding: 0;
}
:root {
--red: #FF073A;
--red-glow: rgba(255, 7, 58, 0.6);
--green: #39FF14;
--green-glow: rgba(57, 255, 20, 0.5);
--cyan: #00e5ff;
--dark: #0a0a0a;
--darker: #050505;
--card-bg: rgba(10, 10, 10, 0.85);
--border-glow: rgba(255, 7, 58, 0.3);
}
body {
margin: 0;
padding: 0;
min-height: 100vh;
background: var(--darker);
color: #fff;
font-family: 'Kosugi Maru', sans-serif;
overflow-x: hidden;
position: relative;
}
#matrixCanvas {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 0;
pointer-events: none;
opacity: 0.25;
}
body::before {
content: '';
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: repeating-linear-gradient(
0deg,
transparent,
transparent 2px,
rgba(0,0,0,0.25) 2px,
rgba(0,0,0,0.25) 4px
);
z-index: 1;
pointer-events: none;
}
body::after {
content: '';
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: radial-gradient(ellipse at center, transparent 50%, rgba(0,0,0,0.7) 100%);
z-index: 1;
pointer-events: none;
}
.main {
position: relative;
z-index: 2;
max-width: 1100px;
margin: 0 auto;
padding: 30px 20px 60px;
text-align: center;
}
.glitch-wrapper {
position: relative;
display: inline-block;
}
.glitch-text {
font-family: 'Staatliches', cursive;
font-size: clamp(3.5rem, 12vw, 8rem);
font-weight: 700;
color: #fff;
text-transform: uppercase;
position: relative;
display: inline-block;
letter-spacing: 4px;
animation: glitch-skew 4s infinite linear alternate-reverse;
text-shadow:
0 0 10px var(--red-glow),
0 0 20px var(--red-glow),
0 0 40px var(--red-glow),
0 0 80px var(--red-glow);
}
.glitch-text::before,
.glitch-text::after {
content: attr(data-text);
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.glitch-text::before {
animation: glitch-effect 3s infinite linear alternate-reverse;
clip-path: polygon(0 0, 100% 0, 100% 45%, 0 45%);
color: var(--cyan);
text-shadow: 2px 0 var(--cyan), -2px 0 var(--red);
}
.glitch-text::after {
animation: glitch-effect2 2s infinite linear alternate-reverse;
clip-path: polygon(0 55%, 100% 55%, 100% 100%, 0 100%);
color: var(--red);
text-shadow: 2px 0 var(--green), -2px 0 var(--cyan);
}
@keyframes glitch-effect {
0% { transform: translate(0); }
20% { transform: translate(-3px, 2px); }
40% { transform: translate(3px, -1px); }
60% { transform: translate(-1px, 3px); }
80% { transform: translate(2px, -2px); }
100% { transform: translate(0); }
}
@keyframes glitch-effect2 {
0% { transform: translate(0); }
25% { transform: translate(2px, -1px); }
50% { transform: translate(-2px, 1px); }
75% { transform: translate(1px, 2px); }
100% { transform: translate(0); }
}
@keyframes glitch-skew {
0% { transform: skew(0deg); }
10% { transform: skew(1deg); }
20% { transform: skew(0deg); }
30% { transform: skew(-1deg); }
40% { transform: skew(0deg); }
50% { transform: skew(1.5deg); }
60% { transform: skew(0deg); }
70% { transform: skew(-1.5deg); }
80% { transform: skew(0deg); }
90% { transform: skew(0.5deg); }
100% { transform: skew(0deg); }
}
.neon-pulse {
animation: neonPulse 1.5s ease-in-out infinite alternate;
}
@keyframes neonPulse {
from {
text-shadow:
0 0 5px var(--red-glow),
0 0 10px var(--red-glow),
0 0 20px var(--red-glow),
0 0 40px var(--red-glow),
0 0 80px var(--red-glow);
}
to {
text-shadow:
0 0 10px var(--red-glow),
0 0 20px var(--red-glow),
0 0 40px var(--red-glow),
0 0 80px var(--red-glow),
0 0 120px var(--red-glow);
}
}
.header {
margin-top: 20px;
margin-bottom: 30px;
}
.header .pre-title {
font-family: 'JetBrains Mono', monospace;
font-size: 14px;
color: var(--green);
letter-spacing: 6px;
text-transform: uppercase;
margin-bottom: 10px;
opacity: 0.9;
text-shadow: 0 0 15px var(--green-glow);
}
.header .pre-title .blink {
animation: blink 1s step-end infinite;
}
@keyframes blink {
0%, 100% { opacity: 1; }
50% { opacity: 0; }
}
.header h1 {
font-family: 'Staatliches', cursive;
font-size: clamp(3rem, 10vw, 7rem);
font-weight: 700;
line-height: 1;
margin-bottom: 8px;
}
.header h1 .red {
color: var(--red);
text-shadow: 0 0 20px var(--red-glow);
}
.header h1 .white-glow {
color: #fff;
text-shadow: 0 0 20px rgba(255,255,255,0.5);
}
.header .sub {
font-family: 'Kosugi Maru', sans-serif;
font-size: clamp(1.2rem, 3vw, 2.5rem);
color: var(--red);
letter-spacing: 3px;
margin-top: -5px;
text-shadow: 0 0 30px var(--red-glow);
}
.header .sub b {
color: #fff;
text-shadow: 0 0 20px rgba(255,255,255,0.8);
}
.logo-container {
margin: 20px 0;
}
.logo-container img {
width: clamp(200px, 40vw, 380px);
height: auto;
filter: drop-shadow(0 0 30px rgba(255,7,58,0.3));
transition: all 0.5s ease;
animation: logoFloat 3s ease-in-out infinite;
}
@keyframes logoFloat {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-10px); }
}
.divider {
display: flex;
align-items: center;
justify-content: center;
gap: 20px;
margin: 25px 0;
color: var(--text-muted);
}
.divider .line {
flex: 1;
max-width: 200px;
height: 2px;
background: linear-gradient(90deg, transparent, var(--red), transparent);
box-shadow: 0 0 15px var(--red-glow);
}
.divider .symbol {
font-size: 24px;
color: var(--red);
text-shadow: 0 0 20px var(--red-glow);
animation: spin 8s linear infinite;
}
@keyframes spin {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
.message-block {
background: var(--card-bg);
border: 1px solid var(--border-glow);
border-radius: 16px;
padding: 30px 25px;
margin: 20px auto;
max-width: 900px;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
box-shadow: 0 0 40px rgba(255,7,58,0.1), inset 0 0 40px rgba(255,7,58,0.03);
transition: all 0.3s;
}
.message-block:hover {
border-color: var(--red);
box-shadow: 0 0 60px rgba(255,7,58,0.2);
}
.message-block .bismillah {
font-family: 'Philosopher', serif;
font-size: 18px;
color: var(--green);
text-shadow: 0 0 20px var(--green-glow);
margin-bottom: 16px;
}
.message-block .question {
font-family: 'Staatliches', cursive;
font-size: 28px;
color: var(--red);
text-shadow: 0 0 20px var(--red-glow);
margin: 10px 0;
}
.message-block .ayat {
font-family: 'Philosopher', serif;
font-size: 16px;
color: var(--green);
font-style: italic;
margin: 10px 0;
}
.message-block p {
font-family: 'Kosugi Maru', sans-serif;
font-size: 15px;
line-height: 1.9;
color: #ccc;
margin: 8px 0;
}
.message-block p b {
color: var(--red);
}
.message-block .final-line {
font-family: 'Staatliches', cursive;
font-size: 24px;
color: var(--red);
text-shadow: 0 0 30px var(--red-glow);
margin-top: 16px;
letter-spacing: 2px;
}
.warning-section {
margin: 30px 0;
padding: 20px;
position: relative;
}
.warning-section h1 {
font-family: 'Staatliches', cursive;
font-size: clamp(3rem, 9vw, 6rem);
font-weight: 700;
color: #fff;
text-shadow:
0 0 10px var(--red-glow),
0 0 20px var(--red-glow),
0 0 40px var(--red-glow),
0 0 80px var(--red-glow);
letter-spacing: 8px;
animation: glitch-skew 5s infinite linear alternate-reverse;
}
.warning-section .sub-line {
font-family: 'Philosopher', serif;
font-size: clamp(1rem, 2.5vw, 1.8rem);
color: var(--green);
text-shadow: 0 0 20px var(--green-glow);
margin: 5px 0;
}
.warning-section .sub-line b {
color: var(--red);
text-shadow: 0 0 20px var(--red-glow);
}
.warning-section .revenge {
font-family: 'Orbitron', monospace;
font-size: clamp(1.2rem, 2.5vw, 2rem);
color: #fff;
letter-spacing: 4px;
margin-top: 10px;
text-shadow: 0 0 30px rgba(255,255,255,0.3);
}
.warning-section .revenge b {
color: var(--red);
text-decoration: underline;
text-shadow: 0 0 30px var(--red-glow);
}
.toggle-container {
margin: 20px 0 10px;
}
.btn-toggle {
font-family: 'Kosugi Maru', sans-serif;
font-weight: 700;
font-size: 16px;
padding: 14px 40px;
background: transparent;
border: 2px solid var(--red);
color: var(--red);
border-radius: 50px;
cursor: pointer;
transition: all 0.4s ease;
text-transform: uppercase;
letter-spacing: 3px;
position: relative;
overflow: hidden;
box-shadow: 0 0 20px transparent;
}
.btn-toggle::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255,7,58,0.2), transparent);
transition: left 0.6s;
}
.btn-toggle:hover::before {
left: 100%;
}
.btn-toggle:hover {
background: var(--red);
color: #000;
box-shadow: 0 0 40px var(--red-glow);
transform: scale(1.05);
}
#message {
max-height: 0;
overflow: hidden;
transition: max-height 0.8s ease, padding 0.5s ease, opacity 0.5s ease;
padding: 0 20px;
opacity: 0;
margin: 0 auto;
max-width: 900px;
}
#message.visible {
max-height: 2000px;
padding: 10px 20px;
opacity: 1;
}
#message .inner {
background: var(--card-bg);
border: 1px solid var(--border-glow);
border-radius: 16px;
padding: 30px 25px;
text-align: left;
backdrop-filter: blur(10px);
box-shadow: 0 0 40px rgba(255,7,58,0.1);
}
#message .inner p {
font-family: 'Kosugi Maru', sans-serif;
font-size: 14px;
line-height: 2;
color: #bbb;
}
#message .inner p b {
color: var(--red);
}
#message .inner p i {
color: var(--green);
}
.team-section {
margin-top: 30px;
}
.team-section .team-label {
font-family: 'Orbitron', monospace;
font-size: 14px;
color: var(--green);
letter-spacing: 4px;
text-transform: uppercase;
text-shadow: 0 0 15px var(--green-glow);
margin-bottom: 12px;
}
.team-grid {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 10px 16px;
max-width: 900px;
margin: 0 auto 10px;
}
.team-grid .team-item {
font-family: 'Philosopher', serif;
font-size: 16px;
color: #fff;
padding: 6px 14px;
border: 1px solid rgba(255,7,58,0.2);
border-radius: 6px;
background: rgba(255,7,58,0.05);
transition: all 0.3s;
}
.team-grid .team-item:hover {
border-color: var(--red);
background: rgba(255,7,58,0.1);
box-shadow: 0 0 20px var(--red-glow);
transform: scale(1.05);
}
.team-grid .team-item .sep {
color: var(--red);
margin: 0 4px;
}
.team-footer-text {
font-family: 'Kosugi Maru', sans-serif;
font-size: 18px;
color: var(--red);
letter-spacing: 2px;
margin: 12px 0;
text-shadow: 0 0 15px var(--red-glow);
}
.footer {
margin-top: 40px;
padding-top: 20px;
border-top: 1px solid rgba(255,7,58,0.2);
}
.footer .stars {
font-size: 28px;
color: var(--green);
text-shadow: 0 0 20px var(--green-glow);
letter-spacing: 10px;
}
.footer .site-link {
font-family: 'Kosugi Maru', sans-serif;
font-size: 18px;
margin: 8px 0;
}
.footer .site-link a {
color: var(--red);
text-decoration: none;
text-shadow: 0 0 15px var(--red-glow);
transition: all 0.3s;
}
.footer .site-link a:hover {
color: var(--green);
text-shadow: 0 0 20px var(--green-glow);
}
.footer .army-name {
font-family: 'Orbitron', monospace;
font-size: 13px;
color: #666;
letter-spacing: 3px;
}
.typing-line {
display: inline-block;
overflow: hidden;
white-space: nowrap;
border-right: 2px solid var(--green);
animation: typing 3s steps(40) 1s forwards, blink-caret 0.8s step-end infinite;
max-width: 0;
}
@keyframes typing {
from { max-width: 0; }
to { max-width: 100%; }
}
@keyframes blink-caret {
0%, 100% { border-color: var(--green); }
50% { border-color: transparent; }
}
@media (max-width: 768px) {
.main { padding: 15px 12px; }
.message-block { padding: 20px 15px; }
.team-grid .team-item { font-size: 13px; padding: 4px 10px; }
.team-grid { gap: 6px 10px; }
}
@media (max-width: 480px) {
.header .pre-title { font-size: 10px; }
.btn-toggle { font-size: 13px; padding: 12px 25px; }
}
</style>
</head>
<body>
<canvas id="matrixCanvas"></canvas>
<div class="main">
<div class="header">
<div class="pre-title">
<span class="blink">⬤</span> SYSTEM COMPROMISED <span class="blink">⬤</span>
</div>
<br><br>
<h1 class="c1"><i><span class="h1">WE ARE </span><span class="underline glow">TURKHACKS</span><span
class="h1">!!!</span></i></h1>
<div class="sub">HACKED BY <b>HACKER</b></div>
</div>
<div class="logo-container">
<a href="https://turkhacks.com" target="_blank">
<img src="https://resmim.net/cdn/2026/07/23/EjHJVK.png" alt="resim yükle" border="0" /></a>
</a>
</div>
<div class="divider">
<div class="line"></div>
<div class="symbol">✦</div>
<div class="line"></div>
</div>
<div class="warning-section">
<h1>GO AWAY ISRAEL !!!</h1>
<div class="sub-line">When the balance of justice is shattered, the voice of conscience begets violence.</div>
<div class="sub-line">I don't know who promised you land, <b>but we promise you the underground of that land</b>!</div>
<div class="revenge">JUSTICE CAN ONLY BE ACHIEVED THROUGH <b>REVENGE.</b></div>
</div>
<div class="toggle-container">
<button class="btn-toggle" id="toggleMessage">☠ We have a message for you ☠</button>
</div>
<div id="message">
<div class="inner">
<p>
<b style="color:var(--red);"><i style="color:var(--green);">In the name of Allah, the Most Gracious, the Most Merciful</i></b><br><br>
<b style="color:var(--red);">Who is Israel ?!</b><br>
<b style="color:var(--red);">Allah says in the Holy Quran:</b> <i style="color:var(--green);">The Jews are a cursed people and are described as cowards.</i><br><br>
These people are so cowardly that they only have the strength to oppress innocent civilians, children, women, and the elderly.<br>
They are so cowardly and treacherous that they have heinously murdered the prophets sent to them.<br>
They are so cowardly and treacherous that they place their own people in key positions worldwide, using money and blackmail to manipulate and control.<br>
They are so cowardly and treacherous that they sell, use, or sacrifice their own children for money and property.<br>
They are so cowardly and treacherous that they view women as worthless objects, property, or slaves.<br>
They are so cowardly and treacherous that they begin to oppress anyone they consider weaker, threatening their property and lives.<br>
They are so cowardly and treacherous that they attack one person with a hundred others. In war, they disregard any rules of ethics, even killing animals out of treachery and dishonor.<br>
They are so cowardly and treacherous that they act like timid individuals, only willing to take extreme measures when their own lives or property are at risk.<br>
They are so cowardly and treacherous that they do not hesitate to use media, television, and social networks to incite discord and unrest in all nations.<br><br>
<b style="color:var(--red);">These people are cursed by Allah.</b> <i style="color:var(--green);">They are dishonorable and shameless people without a homeland. They will be disgraceful until the Day of Judgment.</i><br><br>
No matter where you go in the world, if there is a problem, it is likely that they are involved. They are like bloodsuckers, involved in usury, bribery, immorality, money laundering, gambling, and more. While committing genocide in front of the world's eyes, they create an illusion of justification. From cowards, everything can be expected; the actions of cowards are unpredictable, and true bravery is not seen in them. They are despicable, worthless people.<br><br>
<b style="color:var(--red); font-size:20px;">We will drown you in your own blood and choke you with our saliva.</b>
</p>
</div>
</div>
<div class="divider">
<div class="line"></div>
<div class="symbol">✦</div>
<div class="line"></div>
</div>
<div class="team-section">
<div class="team-label">⚡ OUR TEAM ⚡</div>
<div class="team-grid">
<span class="team-item"><span class="sep">|</span>THS Strategy</span>
<span class="team-item"><span class="sep">|</span> THS Yonetim</span>
<span class="team-item"><span class="sep">|</span> THS Lojistik</span>
<span class="team-item"><span class="sep">|</span> THS Intelligence</span>
<span class="team-item"><span class="sep">|</span> THS Warezzers</span>
<span class="team-item"><span class="sep">|</span> THS Grafik</span>
<span class="team-item"><span class="sep">|</span> THS Attackers</span>
<span class="team-item"><span class="sep">|</span> THS Green Team</span>
<span class="team-item"><span class="sep">|</span> THS Enformasyon</span>
<span class="team-item"><span class="sep">|</span> THS Ar-Ge</span>
<span class="team-item"><span class="sep">|</span> THS Bug Researchers</span>
</div>
<div class="team-footer-text"># Long live HELL for the oppressors</div>
</div>
<div class="footer">
<div class="stars">~~~~~~</div>
<div class="site-link">
<a href="https://turkhacks.com" target="_blank">TURKHACKS.COM</a>
</div>
<div class="army-name">Turkish Hactivst Army</div>
</div>
</div>
<audio id="bgAudio" loop>
<source src="https://d.top4top.io/m_30985gitw1.mp3" type="audio/mpeg">
</audio>
<script>
(function() {
const canvas = document.getElementById('matrixCanvas');
if (!canvas) return;
const ctx = canvas.getContext('2d');
let w, h;
function resize() {
w = canvas.width = window.innerWidth;
h = canvas.height = window.innerHeight;
}
window.addEventListener('resize', resize);
resize();
const chars = 'アイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤユヨラリルレロワヲン0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ<>/{}[]|&^%$#@!';
const fontSize = 14;
const cols = Math.floor(w / fontSize);
const drops = Array(cols).fill(0);
function draw() {
ctx.fillStyle = 'rgba(5, 5, 5, 0.05)';
ctx.fillRect(0, 0, w, h);
ctx.fillStyle = '#39FF14';
ctx.font = fontSize + 'px monospace';
ctx.shadowBlur = 10;
ctx.shadowColor = '#39FF14';
for (let i = 0; i < drops.length; i++) {
const char = chars[Math.floor(Math.random() * chars.length)];
const x = i * fontSize;
const y = drops[i] * fontSize;
ctx.fillText(char, x, y);
if (y > h && Math.random() > 0.975) {
drops[i] = 0;
}
drops[i]++;
}
requestAnimationFrame(draw);
}
draw();
})();
</script>
<script>
document.getElementById('toggleMessage').addEventListener('click', function() {
const msg = document.getElementById('message');
if (msg.classList.contains('visible')) {
msg.classList.remove('visible');
this.textContent = '☠ We have a message for you ☠';
} else {
msg.classList.add('visible');
this.textContent = '✖ Close message ✖';
}
});
</script>
<script>
(function() {
const audio = document.getElementById('bgAudio');
if (!audio) return;
// Attempt to play after any user interaction
const tryPlay = () => {
audio.play().catch(() => {});
document.removeEventListener('click', tryPlay);
document.removeEventListener('touchstart', tryPlay);
};
document.addEventListener('click', tryPlay);
document.addEventListener('touchstart', tryPlay);
// Also try immediately (may be blocked)
audio.play().catch(() => {});
})();
</script>
</body>
</html>İNDEX RESİM İNGİLİZCE DİLİNDE
İNDEX RESİM TÜRKÇE DİLİNDE
Son düzenleme:
