<meta charset='UTF-8'/><meta content='width=device-width, initial-scale=1, user-scalable=1, minimum-scale=1, maximum-scale=5' name='viewport'/><meta content='IE=edge' http-equiv='X-UA-Compatible'/>



<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=Work+Sans:[email protected];700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Ubuntu:[email protected];700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap" rel="stylesheet">

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/sweetalert2.all.min.js"></script>
<script src="https://kit.fontawesome.com/4f3ce16e3e.js" crossorigin="anonymous"></script>

<link href="/style.css" rel="stylesheet" type="text/css" />


Script HTML Untukmu<title>Script HTML Untukmu</title>


<!-- Edit Wallpaper
di background-image URL --><style>
:root {
--warna-bg: rgba(0, 0, 0, .5);
--warna-teks: #fff;
--warna-bingkai: #fff;
--bingkai: 8px;
--bingkai-kiri: 2px solid var(--warna-bingkai);
--bingkai-kanan: 2px solid var(--warna-bingkai);
--gaya-font: 'Work Sans', sans-serif;
--gaya-font2: 'Ubuntu', sans-serif;
--gaya-font3: 'Dancing Script', sans-serif;
}
@keyframes fanim {0% {background-position: 0% 0%;}25% {background-position: 100% 100%;} 50% {background-position: 0% 100%;} 75% {background-position: 50% 50%;} 100% {background-position: 0% 0%;}}
body{background-color:#000;font-family:var(--gaya-font);padding: 20px 25px;-webkit-user-select: none; -ms-user-select: none; user-select: none;} a{text-decoration:none;}
body::before{content:"\00A9 Rayys | PalingIT";color:white;opacity:0;font-size:11px;position:fixed;bottom:25px;right:25px;z-index:2}
#bodyblur{opacity:1;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.3);transition:all 1s ease;}
#wallpaper{width:100%;height:100%;transform: scale(2);transition:all 1.3s ease;}
#beneranblur{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.3);-webkit-backdrop-filter:blur(0px); backdrop-filter:blur(0px);transition:all 3s ease;}

@keyframes jj{0% {transform: scale(1.1);} 50% {transform: scale(1.2);} 100% {transform: scale(1.1);}}
@keyframes rts{from {transform:scale(.1);} to {transform:scale(1);}}
@keyframes rto{from {transform:scale(1);} to {transform:scale(1.1);}}
@keyframes aniopa{0% {transform: scale(1);} 50% {transform: scale(.75);} 100% {transform: scale(1);}}
@keyframes rtf{from {transform: rotate(0deg);} to {transform: rotate(360deg);}} @keyframes rt{from {transform: scale(.9);/* transform: rotate(-5deg); /} to {transform: scale(1);/ transform: rotate(5deg); */}}
@keyframes kont{0% {left:-1px; top:-3px;} 50% {left:1px; top:3px;} 100% {left:-1px; top:-3px;}}

blockquote{position:absolute;opacity:0;visibility:hidden;margin-top:100px;background:var(--warna-bg);border-radius:8px;box-shadow: rgba(255,255,255, 0.3) 0px 7px 29px 0px;transform: scale(.1);transition:all 1s ease;margin-top:120px;margin-left:0;margin-right:0;color:var(--warna-teks);text-shadow: 0px 2px 2px rgba(0, 0, 0, .8);}
blockquote{width:400px;text-align:center;line-height:1.3em;padding:10px 20px;}
blockquote::before{content: "";position: absolute;border: 1px solid #fff;border-radius:8px;top: -8px;bottom: -8px;left: -8px;right: -8px;}
blockquote p{font-size:18px;font-weight:700;line-height:1.4em;transition:all .5s ease;}
blockquote #kalimat2{font-size:16px;font-weight:400;}
blockquote #kalimatbawah{position: absolute;opacity:0;transform: scale(.3);font-family:var(--gaya-font3);font-size:22px;font-weight:700;}

#Tombol{position:relative;opacity:0;margin:0;display:flex;align-items:left;list-style:none;transform: scale(.1);transition:all 1s ease;}
#Tombol a{cursor:pointer;display:inline-flex;align-items:center; margin:0;margin:12px 0 12px 0;transition:all .2s ease;padding:10px;outline:0;border-right:var(--bingkai-kanan);border-left:var(--bingkai-kiri);border-radius:4px;line-height:15px;background:var(--warna-bg);color:var(--warna-teks);font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;box-shadow: rgba(255,255,255, 0.3) 0px 7px 29px 0px;z-index:1}

#Content{animation-name:none;animation-duration: 3s;animation-iteration-count: infinite;position:relative;opacity:0;margin-top:50px;width:100%;height:180px;transition:all .7s ease;}
#Content > *{display:flex;align-items:center;text-align:center;justify-content:center;margin-top:1px;}
.kumpulanstiker > img{display:none;box-shadow: rgba(255,255,255, 0.3) 0px 7px 29px 0px;background:#fff;border-radius:8px;padding:10px;width:90px;height:90px;margin:20px 0;}
#stiker{opacity:.1;transition:all 1.2s ease;transform: scale(.1);}
#halo{font-size:18px !important;position:relative;margin:15px 0 30px 0}

#fotolove img{transition:all .5s ease;width:75px;height:75px;padding:0;background:none}
#suratin img{display:inline-flex;background:rgba(255,255,255, 0);border-radius:10%;padding:10px;width:130px;height:130px;animation:rto .7s infinite alternate;transition:all .3s ease;}
#ket, #halo{text-shadow: 0px 2px 2px rgba(0, 0, 0, .8);font-size:17px;font-weight:700;color:white}
#ket{margin-top:15px !important;font-weight:400;}

#kolombaru{position:absolute;opacity:0;display:flex;transform:scale(.1);transition:all 1s ease;align-items:center;text-align:center;justify-content:center;}
#kolombaru > li{margin: 10px;padding: 10px;list-style-type: none;}
#kolombaru li img{display:flex;width:40px;height:40px}
#kolombaru li img:hover{transform: scale(1.15);transition:all .3s ease;}

.swal2-modal > *{font-family:var(--gaya-font2);font-size:17px;}
.swal2-title{line-height:1.3em;font-size:18px;text-align:center;padding:15px 20px 0 20px;}
.swal2-container.swal2-backdrop-show{background: rgba(0,0,0,.5);}
.swal2-timer-progress-bar-container > *{opacity:.7;background:#007BFF;margin:0 2px}
.swal2-modal{box-shadow: rgba(100, 100, 111, 0.5) 0px 7px 29px 0px;max-width:320px;background:rgba(240,240,240,1);border-radius:8px;top:-80px;}

.fa-heart {opacity:.3;color:white;font-size: 27px;position: absolute;animation: heartMove linear 1;top: -10vh;z-index: 0;}
@keyframes heartMove {0%{transform: translateY(-10vh) ;} 100%{transform: translateY(100vh) ;}}
.sembunyi, #kado2, #kado3{display:none !important}
</style>


<!-- Ganti Audio di sini -->
<audio src="https://feeldreams.github.io/fullsenyum.mp3" id="linkmp3" class="sembunyi"></audio>

<div id="bodyblur">
<!-- Wallpaper --><img src="https://feeldreams.github.io/nightin.jpeg" id="wallpaper"/><div id="beneranblur"></div>
</div>

<div id='Content'>

<div id="suratin" onClick="memulai();">
<!-- Tombol Surat --><img src="https://feeldreams.github.io/kadoin.png"/>
</div>
<p id="ket">Klik Kadonya!</p>

<div class="kumpulanstiker">
<!-- Stiker untuk Konten -->
<img src="https://feeldreams.github.io/pusn.gif" id="stiker1"/>
<img src="https://feeldreams.github.io/bunga.gif" id="stiker2"/>
<img src="https://feeldreams.github.io/mndkat.gif" id="stiker3"/>
<img src="https://feeldreams.github.io/smprt.gif" id="stiker4"/>
<img src="https://feeldreams.github.io/ngumpet.gif" id="stiker5"/>

<!-- Stiker untuk Akhiran -->
<img src="https://l.top4top.io/p_2567ooxm30.jpg" id="stiker" onClick="ftaksi();"/>
<img src="https://l.top4top.io/p_2567ooxm30.jpg" id="stikerAkhir"/>
</div>
<p id="halo">Good Night Kamu!</p>

<script class="sembunyi">
async function pesanAwal() {
suratin.style="display:none";ket.style="display:none";
await swalst.fire({
title: 'Hai, Kamu! ❤️',
imageUrl: '' + stiker1.src,
});
await swalst.fire({
title: 'Aku Cuma Mau Bilang 😍',
imageUrl: '' + stiker2.src,
});
await swalst.fire({
title: 'Good Night ya! 🤭❤️',
imageUrl: '' + stiker3.src,
});
await swalst.fire({
title: 'Gabole Tidur Malem² 😡❤️',
imageUrl: '' + stiker4.src,
});
await swalst.fire({
title: 'Ntar ovt lagi loh 🥺❤️',
imageUrl: '' + stiker5.src,
});
mulaikonten();
}
</script>
<div><blockquote id='bq'>

<!-- Konten Pembukaan -->
<p id="kalimat">Syahril sayang Rara🤭❤️ </p>
<p id="kalimat2">Selamat melepas lelah, jangan lupa baca doa dulu sebelum bobo 😍 ... Semangat buat besok jalani harinya yaa..🥳 Dan Jangan Gigit Lageeeeeee Sakit Tau😭😭</p>
<p id="kalimatbawah">I Love You ❤️</p>
<p id="kalimatbawah2" class="sembunyi">Good Night ❤️</p>
<p id="kalimatbawah3" class="sembunyi">Mimpi Indah ya ❤️</p>

</blockquote></div>

<!-- Tombol Multifungsi -->
<div id="Tombol">
<a onClick="multifungsi()">
<b id="tmbl">💌 Kirim
</a>
</div>

<!-- Pesan yang dikirim ke WhatsApp -->
<span id="pesanWA" class="sembunyi">Awww Good Night too Ayg Syahril❤️❤️❤️</span>

</div>

<!-- Jangan Edit Bagian Ini --><script>
ftom=0;aksift=0;ftganti=0;flag=1;flagg=1;fungsi=0;fungsiAwal=0;fungsitimer=0;vketikhalo=halo.innerHTML;
halo.innerHTML = "";var ahalo=0,vketikhalo;pesanwhatsapp = pesanWA.innerHTML;
Content.style = "opacity:1;margin-top:16vh;";

function memulai(){if(fungsiAwal==0){audio.play();fungsiAwal=1;suratin.style="transition:all .8s ease;transform:scale(10);opacity:0";wallpaper.style="transform: scale(1.5);";ket.style="display:none";setTimeout(pesanAwal,700)}}

async function mulaikonten() {
Content.style = "opacity:1;margin-top:0";
bodyblur.style="opacity:.7";
wallpaper.style="transform: scale(1);";
stiker.style="display:inline-flex;";
setTimeout(ftmuncul,200);
setTimeout(kethalo,500);
}

function kethalo(){if(ahalo<vketikhalo.length){halo.innerHTML += vketikhalo.charAt(ahalo);ahalo++;setTimeout(kethalo,60);}if(ahalo==vketikhalo.length){setTimeout(bqmuncul,200);}}
function bqmuncul(){bq.style = "position:relative;opacity:1;visibility:visible;transform: scale(1);margin-top:0";mulaiketik1();fungsi=1;}

kal1=kalimat.innerHTML;kalimat.innerHTML = "";var aa=0,kal1;
function mulaiketik1(){
if(aa<kal1.length){
kalimat.innerHTML += kal1.charAt(aa);aa++;
setTimeout(mulaiketik1,150);
}
if(aa==kal1.length){mulaiketik2();}
}
kal2=kalimat2.innerHTML;kalimat2.innerHTML = "";var aaa=0,kal2;
function mulaiketik2(){
if(aaa<kal2.length){
kalimat2.innerHTML += kal2.charAt(aaa);aaa++;
setTimeout(mulaiketik2,200);
}
if(aaa==kal2.length){setInterval(createHeart,800);setTimeout(munculbwh,1000);setTimeout(tombol,3000);}
}
defkalimatbawah = kalimatbawah.innerHTML;
function munculbwh(){kalimatbawah.innerHTML=defkalimatbawah;setTimeout(munculbwh2,2000);otomatis();}
function munculbwh2(){kalimatbawah.innerHTML=kalimatbawah2.innerHTML;setTimeout(munculbwh3,2000);otomatis();}
function munculbwh3(){kalimatbawah.innerHTML=kalimatbawah3.innerHTML;setTimeout(munculbwh,2000);otomatis();}

function ftaksi(){if(aksift==1){aksift=0;}}
function ftmuncul(){
if(ftganti==0){stiker.style="display:inline-flex;opacity:1;transform:scale(1)";}
if(ftganti==1){stiker.src = stikerAkhir.src;stiker.style="display:inline-flex;opacity:1;transition:all .7s ease;transform:scale(1);";}
}
function fthilang(){stiker.style="display:inline-flex;opacity:1;transition:all .7s ease;transform:scale(.1)";}

function tombol(){ftom=1;Tombol.style="opacity:1;transform: scale(1);";}
function multifungsi(){if(ftom==1){menuju();}}
async function menuju(){window.location = "https://api.whatsapp.com/send?phone=&text=" + pesanwhatsapp;}

const body = document.querySelector("body");const swalst = Swal.mixin({timer: 2300, allowOutsideClick: false, showConfirmButton: false, timerProgressBar: true, imageHeight: 90,}); const swals = Swal.mixin({allowOutsideClick: false, cancelButtonColor: '#FF0040', imageWidth: 100, imageHeight: 100,});
audio = new Audio('' + linkmp3.src);

function otomatis() {kalimatbawah.style="position:relative;opacity:0;transform:scale(.3);";setTimeout(anim,300);}
function anim() {kalimatbawah.style="position:relative;opacity:1;transform:scale(1);";}
function createHeart() {const heart = document.createElement("div"); heart.className = "fas fa-heart"; heart.style.left = (Math.random() * 90)+"vw"; heart.style.animationDuration = (Math.random()*3)+2+"s"; body.appendChild(heart);} setInterval(function name(params) {var heartArr = document.querySelectorAll(".fa-heart"); if (heartArr.length > 100) {heartArr[0].remove()}},100);
</script>
<!-- Sampai Sini -->