Yüzde Hesaplama ve Yüzde Değişim
Ham HTML
<!DOCTYPE html>
<html lang="tr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Yüzde Hesaplama ve Yüzde Değişim - Ücretsiz Online Araç</title>
<meta name="description" content="Bir sayının yüzdesini bulun, bir sayının diğerinin yüzde kaçı olduğunu öğrenin veya iki değer arasındaki yüzde değişimi hesaplayın. %100 tarayıcıda çalışır.">
<meta name="robots" content="index, follow">
<meta property="og:type" content="website">
<meta property="og:title" content="Yüzde Hesaplama ve Yüzde Değişim - Ücretsiz Online Araç">
<meta property="og:description" content="Bir sayının yüzdesini bulun, yüzde oranını veya yüzde değişimi anında hesaplayın. %100 tarayıcıda çalışır, veri gönderilmez.">
<meta name="theme-color" content="#6366f1">
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "WebApplication",
"name": "Yüzde Hesaplama ve Yüzde Değişim Aracı",
"description": "Bir sayının belirli bir yüzdesini bulma, bir sayının diğerinin yüzde kaçı olduğunu hesaplama ve iki değer arasındaki yüzde değişimi (artış/azalış) hesaplama modlarını içeren ücretsiz online araç.",
"applicationCategory": "UtilitiesApplication",
"operatingSystem": "Any",
"offers": { "@type": "Offer", "price": "0", "priceCurrency": "TRY" }
}
</script>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "FAQPage",
"mainEntity": [
{
"@type": "Question",
"name": "Yüzde nasıl hesaplanır?",
"acceptedAnswer": { "@type": "Answer", "text": "Bir sayının yüzdesini bulmak için, sayıyı yüzde değerine bölüp 100 ile çarparsınız: Sonuç = Sayı x Yüzde / 100. Örneğin 200'ün %15'i, 200 x 15 / 100 = 30 işlemiyle bulunur." }
},
{
"@type": "Question",
"name": "Bir sayının belirli bir yüzdesi nasıl bulunur?",
"acceptedAnswer": { "@type": "Answer", "text": "X sayısının Y yüzdesini bulmak için X değerini Y ile çarpıp 100'e bölmeniz yeterlidir: X x Y / 100. Bu araçtaki \"Bir Sayının Yüzdesini Bul\" modu bu işlemi sizin için otomatik yapar." }
},
{
"@type": "Question",
"name": "Yüzde değişim (artış/azalış) nasıl hesaplanır?",
"acceptedAnswer": { "@type": "Answer", "text": "Yüzde değişim, yeni değer ile eski değer arasındaki farkın, eski değere bölünüp 100 ile çarpılmasıyla bulunur: (Yeni Değer - Eski Değer) / Eski Değer x 100. Sonuç pozitifse artış, negatifse azalış anlamına gelir." }
},
{
"@type": "Question",
"name": "Yüzde puan ile yüzde değişim arasındaki fark nedir?",
"acceptedAnswer": { "@type": "Answer", "text": "Yüzde puan, iki yüzde değeri arasındaki basit farktır (örneğin %20'den %25'e çıkış 5 yüzde puandır). Yüzde değişim ise bu farkın başlangıç değerine oranlanmış halidir (aynı örnekte %25 yüzde değişim). Bu iki kavram sıkça karıştırılır ancak farklı anlamlar taşır." }
}
]
}
</script>
<style>
:root {
--bg:#f5f6fb; --surface:#fff; --surface-2:#f0f2f9; --border:#e3e6f0;
--text:#1d2033; --muted:#6b7089; --primary:#6366f1; --primary-600:#4f46e5;
--primary-soft:#eef0ff; --success:#10b981; --danger:#ef4444; --warning:#f59e0b;
--radius:16px; --shadow:0 10px 30px -12px rgba(30,35,90,.18);
}
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; background: var(--bg); color: var(--text); line-height:1.55; }
.container { max-width: 720px; margin: 0 auto; padding: 24px 16px 60px; }
header.hero { text-align:center; padding: 28px 0 8px; }
header.hero h1 { font-size: clamp(1.5rem, 4vw, 2rem); margin: 0 0 8px; }
header.hero p { color: var(--muted); margin:0; font-size: 1rem; }
.trust-badge { display:inline-flex; align-items:center; gap:6px; background: var(--primary-soft); color: var(--primary-600); font-size: .8rem; font-weight:600; padding:6px 14px; border-radius:999px; margin-top:12px; }
.ad-slot { min-height: 0; }
.card { background: var(--surface); border:1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); padding: 24px; margin: 20px 0; }
.field { margin-bottom: 16px; }
.field label { display:block; font-size: .88rem; font-weight:600; margin-bottom:6px; color: var(--text); }
.field .hint { font-size:.78rem; color: var(--muted); margin-top:4px; }
select, input[type="text"] { width:100%; padding: 12px 14px; border: 1px solid var(--border); background: var(--surface-2); border-radius: 12px; font-size: 1rem; color: var(--text); outline:none; transition: border-color .15s, box-shadow .15s; font-family:inherit; }
select:focus, input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-soft); }
.grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 14px; }
.mode-fields { display:none; }
.mode-fields.active { display:block; }
.btn { width:100%; padding: 14px 20px; border:none; border-radius: 12px; background: var(--primary); color:#fff; font-size: 1rem; font-weight:700; cursor:pointer; transition: background .15s, transform .05s; margin-top: 6px; }
.btn:hover { background: var(--primary-600); }
.btn:active { transform: scale(.99); }
.warning { display:none; background: #fff4e5; border: 1px solid var(--warning); color:#8a5a00; padding: 12px 14px; border-radius: 12px; font-size:.88rem; margin-top: 14px; }
.warning.show { display:block; }
.result { display:none; margin-top: 20px; border-top: 1px dashed var(--border); padding-top: 18px; }
.result.show { display:block; }
.result-item { background: var(--surface-2); border-radius: 12px; padding: 18px; text-align:center; }
.result-item .label { font-size:.78rem; color: var(--muted); margin-bottom:6px; }
.result-item .value { font-size: 1.4rem; font-weight:700; color: var(--primary-600); }
.result-item.success .value { color: var(--success); }
.result-item.danger .value { color: var(--danger); }
section.seo h2 { font-size: 1.25rem; margin: 28px 0 10px; }
section.seo p { color: var(--text); font-size: .96rem; }
details { background: var(--surface); border:1px solid var(--border); border-radius: 12px; padding: 14px 16px; margin-bottom: 10px; box-shadow: var(--shadow); }
summary { cursor:pointer; font-weight:600; font-size:.95rem; }
details p { margin: 10px 0 0; color: var(--muted); font-size:.9rem; }
@media (max-width:480px) { .card { padding:18px; } }
</style>
</head>
<body>
<div class="container">
<header class="hero">
<h1>Yüzde Hesaplama ve Yüzde Değişim Aracı</h1>
<p>İstediğiniz hesaplama türünü seçin, değerleri girin, sonucu anında görün.</p>
<span class="trust-badge">🔒 %100 Tarayıcıda — Veriniz Hiçbir Yere Gönderilmez</span>
</header>
<!-- [reklam:arac-header] -->
<div class="ad-slot"></div>
<main class="card">
<div class="field">
<label for="modeSelect">Hesaplama Türü</label>
<select id="modeSelect" onchange="toggleMode()">
<option value="percentOf">Bir Sayının Yüzdesini Bul (X'in %Y'si)</option>
<option value="whatPercent">Bir Sayı, Diğerinin Yüzde Kaçı? (X, Y'nin %kaçı)</option>
<option value="percentChange">Yüzde Değişim (Eski Değerden Yeniye)</option>
</select>
</div>
<div class="mode-fields active" id="mode-percentOf">
<div class="grid">
<div class="field">
<label for="pofX">Sayı (X)</label>
<input type="text" inputmode="decimal" id="pofX" placeholder="Örn: 200">
</div>
<div class="field">
<label for="pofY">Yüzde (Y)</label>
<input type="text" inputmode="decimal" id="pofY" placeholder="Örn: 15">
</div>
</div>
<div class="hint">Örnek: 200 sayısının %15'i kaçtır?</div>
</div>
<div class="mode-fields" id="mode-whatPercent">
<div class="grid">
<div class="field">
<label for="wpX">Sayı (X)</label>
<input type="text" inputmode="decimal" id="wpX" placeholder="Örn: 30">
</div>
<div class="field">
<label for="wpY">Sayı (Y)</label>
<input type="text" inputmode="decimal" id="wpY" placeholder="Örn: 200">
</div>
</div>
<div class="hint">Örnek: 30, 200'ün yüzde kaçıdır?</div>
</div>
<div class="mode-fields" id="mode-percentChange">
<div class="grid">
<div class="field">
<label for="pcOld">Eski Değer</label>
<input type="text" inputmode="decimal" id="pcOld" placeholder="Örn: 80">
</div>
<div class="field">
<label for="pcNew">Yeni Değer</label>
<input type="text" inputmode="decimal" id="pcNew" placeholder="Örn: 100">
</div>
</div>
<div class="hint">Örnek: 80'den 100'e geçişte yüzde kaç artış/azalış var?</div>
</div>
<button class="btn" onclick="hesaplaYuzde()">Hesapla</button>
<div class="warning" id="warningBox"></div>
<div class="result" id="resultBox">
<div class="result-item" id="resCard">
<div class="label" id="resLabel">Sonuç</div>
<div class="value" id="resValue">-</div>
</div>
</div>
</main>
<!-- [reklam:arac-alt] -->
<div class="ad-slot"></div>
<section class="seo">
<h2>Yüzde Hesaplama Nedir?</h2>
<p>Yüzde hesaplama, bir bütünün yüz eşit parçaya bölündüğünde her parçanın büyüklüğünü ifade eden ve günlük hayatta indirim hesaplama, bahşiş bırakma, not ortalaması bulma, bütçe planlama ve finansal analiz gibi sayısız alanda karşımıza çıkan temel bir matematiksel işlemdir. Bu araç üç farklı yüzde hesaplama ihtiyacını tek bir yerde birleştirir: bir sayının belirli bir yüzdesini bulma, bir sayının başka bir sayının yüzde kaçı olduğunu öğrenme ve iki değer arasındaki yüzde değişimi (artış veya azalış) hesaplama. Bu üç hesaplama türü günlük hayatta en sık ihtiyaç duyulan yüzde problemlerini kapsar.</p>
<h2>Nasıl Kullanılır?</h2>
<p>Öncelikle "Hesaplama Türü" menüsünden ihtiyacınıza uygun modu seçin. "Bir Sayının Yüzdesini Bul" modunda bir sayı ve bir yüzde değeri girerek sonucu bulabilirsiniz (örneğin 200'ün %15'i). "Bir Sayı, Diğerinin Yüzde Kaçı?" modunda iki sayı girerek birincinin ikinciye oranını yüzde olarak görebilirsiniz. "Yüzde Değişim" modunda ise eski ve yeni değerleri girerek aradaki artış veya azalışın yüzdesini hesaplayabilirsiniz; sonuç pozitifse artışı, negatifse azalışı gösterir. Her modda ilgili alanları doldurup "Hesapla" butonuna basmanız yeterlidir. Tüm işlemler tarayıcınızda gerçekleşir, hiçbir veri kaydedilmez veya gönderilmez.</p>
<h2>Sıkça Sorulan Sorular</h2>
<details>
<summary>Yüzde nasıl hesaplanır?</summary>
<p>Bir sayının yüzdesini bulmak için, sayıyı yüzde değerine bölüp 100 ile çarparsınız: Sonuç = Sayı x Yüzde / 100. Örneğin 200'ün %15'i, 200 x 15 / 100 = 30 işlemiyle bulunur.</p>
</details>
<details>
<summary>Bir sayının belirli bir yüzdesi nasıl bulunur?</summary>
<p>X sayısının Y yüzdesini bulmak için X değerini Y ile çarpıp 100'e bölmeniz yeterlidir: X x Y / 100. Bu araçtaki "Bir Sayının Yüzdesini Bul" modu bu işlemi sizin için otomatik yapar.</p>
</details>
<details>
<summary>Yüzde değişim (artış/azalış) nasıl hesaplanır?</summary>
<p>Yüzde değişim, yeni değer ile eski değer arasındaki farkın, eski değere bölünüp 100 ile çarpılmasıyla bulunur: (Yeni Değer - Eski Değer) / Eski Değer x 100. Sonuç pozitifse artış, negatifse azalış anlamına gelir.</p>
</details>
<details>
<summary>Yüzde puan ile yüzde değişim arasındaki fark nedir?</summary>
<p>Yüzde puan, iki yüzde değeri arasındaki basit farktır (örneğin %20'den %25'e çıkış 5 yüzde puandır). Yüzde değişim ise bu farkın başlangıç değerine oranlanmış halidir (aynı örnekte %25 yüzde değişim). Bu iki kavram sıkça karıştırılır ancak farklı anlamlar taşır.</p>
</details>
</section>
</div>
<script>
function toggleMode() {
var mode = document.getElementById("modeSelect").value;
var groups = document.querySelectorAll(".mode-fields");
for (var i = 0; i < groups.length; i++) {
groups[i].classList.remove("active");
}
document.getElementById("mode-" + mode).classList.add("active");
clearWarning();
document.getElementById("resultBox").classList.remove("show");
}
function showWarning(msg) {
var box = document.getElementById("warningBox");
box.textContent = msg;
box.classList.add("show");
document.getElementById("resultBox").classList.remove("show");
}
function clearWarning() {
var box = document.getElementById("warningBox");
box.textContent = "";
box.classList.remove("show");
}
function roundNice(value) {
var rounded = Math.round(value * 10000) / 10000;
return rounded.toString();
}
function hesaplaYuzde() {
clearWarning();
var mode = document.getElementById("modeSelect").value;
var resCard = document.getElementById("resCard");
var resLabel = document.getElementById("resLabel");
var resValue = document.getElementById("resValue");
resCard.classList.remove("success", "danger");
if (mode === "percentOf") {
var x = parseFloat(document.getElementById("pofX").value.replace(",", "."));
var y = parseFloat(document.getElementById("pofY").value.replace(",", "."));
if (isNaN(x) || isNaN(y)) {
showWarning("Lütfen her iki alanı da geçerli bir sayı ile doldurun.");
return;
}
var result = (x * y) / 100;
resLabel.textContent = x + " sayısının %" + y + "'si";
resValue.textContent = roundNice(result);
} else if (mode === "whatPercent") {
var x2 = parseFloat(document.getElementById("wpX").value.replace(",", "."));
var y2 = parseFloat(document.getElementById("wpY").value.replace(",", "."));
if (isNaN(x2) || isNaN(y2)) {
showWarning("Lütfen her iki alanı da geçerli bir sayı ile doldurun.");
return;
}
if (y2 === 0) {
showWarning("İkinci sayı (Y) 0 olamaz.");
return;
}
var result2 = (x2 / y2) * 100;
resLabel.textContent = x2 + ", " + y2 + "'nin yüzde kaçı";
resValue.textContent = roundNice(result2) + "%";
} else {
var oldVal = parseFloat(document.getElementById("pcOld").value.replace(",", "."));
var newVal = parseFloat(document.getElementById("pcNew").value.replace(",", "."));
if (isNaN(oldVal) || isNaN(newVal)) {
showWarning("Lütfen her iki alanı da geçerli bir sayı ile doldurun.");
return;
}
if (oldVal === 0) {
showWarning("Eski değer 0 olamaz, yüzde değişim hesaplanamaz.");
return;
}
var change = ((newVal - oldVal) / Math.abs(oldVal)) * 100;
resLabel.textContent = change >= 0 ? "Yüzde Artış" : "Yüzde Azalış";
resValue.textContent = (change >= 0 ? "+" : "") + roundNice(change) + "%";
resCard.classList.add(change >= 0 ? "success" : "danger");
}
document.getElementById("resultBox").classList.add("show");
}
</script>
</body>
</html>
Kategori
Eğitim ve Matematik Araçları
MMUTLU.CMS
Kurumsal web siteleri için içerik yönetim sistemi.
© 2026 Mutlu DoğruBu site MUTLU.CMS ile yayınlanmaktadır.