Mayın Tarlası Oyunu Oyna | Ücretsiz Online Klasik Zeka Oyunu

TAKİP ET

Ücretsiz Mayın Tarlası oyununu hemen oyna. Mayınlara basmadan güvenli kutuları aç, bayrakları doğru kullan ve en kısa sürede oyunu tamamla.

Mayın Tarlası, dikkat, mantık ve stratejiyi bir araya getiren klasik bir zeka oyunudur. Amaç, oyun alanındaki mayınlara basmadan tüm güvenli kutuları açmaktır. Açılan her kutu, çevresindeki mayın sayısını gösteren ipuçları verir ve doğru kararlar almanı sağlar. Şüpheli bölgeleri bayrakla işaretleyerek ilerleyebilir, dikkatli hamlelerle oyunu başarıyla tamamlayabilirsin. Mobil telefon, tablet ve bilgisayarlarda sorunsuz çalışan bu ücretsiz Mayın Tarlası oyunu, hızlı yüklenen yapısı ve kullanıcı dostu arayüzüyle keyifli bir deneyim sunar. Düşünme becerini geliştirmek, dikkatini test etmek ve boş zamanlarını eğlenceli bir şekilde değerlendirmek için hemen Mayın Tarlası oynamaya başlayabilir, en kısa sürede tüm güvenli alanları açarak kendi rekorunu kırabilirsin.

 

Mini Oyun

Mayın Tarlası

Mayınlara basmadan güvenli kutuları aç. Şüpheli alanları bayrakla işaretle ve 10 mayının tamamını bul.

Kolay Seviye 9 × 9 Oyun Alanı · 10 Mayın Mayın 010 Süre 000 Bayrak Modu: Kapalı Başlamak için bir kutuya dokun.  

Kutuları açmak için dokun veya sol tıkla.

Bayrak modu açıkken kutuya dokunarak işaretle.

.gulum-mayin, .gulum-mayin * { box-sizing: border-box; } .gulum-mayin__svg-defs { position: absolute; width: 0; height: 0; overflow: hidden; pointer-events: none; } .gulum-mayin__icon { display: block; width: 1em; height: 1em; flex: 0 0 auto; fill: currentColor; overflow: visible; pointer-events: none; } .gulum-mayin { --mayin-purple: #7c3aed; --mayin-purple-light: #a855f7; --mayin-pink: #ec4899; --mayin-blue: #38bdf8; --mayin-red: #ef4444; --mayin-green: #22c55e; --mayin-dark: #17152d; --mayin-dark-soft: #242044; --mayin-text: #ffffff; --mayin-muted: #cbc8df; width: 100%; padding: 35px 14px; color: var(--mayin-text); font-family: Arial, Helvetica, sans-serif; } .gulum-mayin__container { width: min(100%, 540px); margin: 0 auto; padding: 28px 24px; text-align: center; background: radial-gradient( circle at top right, rgba(168, 85, 247, 0.25), transparent 35% ), radial-gradient( circle at bottom left, rgba(56, 189, 248, 0.12), transparent 35% ), linear-gradient( 145deg, var(--mayin-dark), var(--mayin-dark-soft) ); border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 26px; box-shadow: 0 24px 60px rgba(25, 15, 65, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.08); } .gulum-mayin__header { margin-bottom: 18px; } .gulum-mayin__badge { display: inline-flex; align-items: center; justify-content: center; min-height: 28px; margin-bottom: 11px; padding: 5px 14px; color: #ffffff; font-size: 12px; font-weight: 700; letter-spacing: 0.6px; text-transform: uppercase; background: linear-gradient( 135deg, var(--mayin-purple), var(--mayin-pink) ); border-radius: 999px; } .gulum-mayin__title { margin: 0 0 9px; padding: 0; color: #ffffff; font-size: clamp(30px, 8vw, 42px); font-weight: 800; line-height: 1.15; } .gulum-mayin__description { margin: 0; padding: 0; color: var(--mayin-muted); font-size: 14px; line-height: 1.65; } .gulum-mayin__info { display: flex; flex-direction: column; gap: 4px; margin-bottom: 16px; padding: 11px 14px; background: rgba(255, 255, 255, 0.07); border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 13px; } .gulum-mayin__info span { color: #ffffff; font-size: 14px; font-weight: 700; } .gulum-mayin__info strong { color: var(--mayin-muted); font-size: 11px; font-weight: 600; } .gulum-mayin__toolbar { display: grid; grid-template-columns: 1fr 64px 1fr; align-items: center; gap: 10px; margin-bottom: 13px; padding: 11px; background: rgba(0, 0, 0, 0.2); border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 16px; } .gulum-mayin__counter { display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 0; min-height: 54px; padding: 7px; background: rgba(255, 255, 255, 0.07); border-radius: 11px; } .gulum-mayin__counter span { margin-bottom: 4px; color: var(--mayin-muted); font-size: 10px; font-weight: 700; text-transform: uppercase; } .gulum-mayin__counter strong { color: #ff6078; font-family: "Courier New", monospace; font-size: 23px; line-height: 1; letter-spacing: 1px; } .gulum-mayin__restart { display: flex; align-items: center; justify-content: center; width: 58px; height: 58px; margin: 0 auto; padding: 0; appearance: none; -webkit-appearance: none; color: #ffffff; background: rgba(255, 255, 255, 0.11); border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 15px; outline: none; cursor: pointer; transform: none; transition: background-color 0.18s ease, border-color 0.18s ease; } .gulum-mayin__restart:hover { background: rgba(255, 255, 255, 0.18); } .gulum-mayin__restart:active, .gulum-mayin__restart:focus { transform: none; } .gulum-mayin__face-icon { width: 34px; height: 34px; } .gulum-mayin__flag-button { display: inline-flex; align-items: center; justify-content: center; gap: 9px; width: 100%; min-height: 44px; margin: 0 0 13px; padding: 10px 15px; appearance: none; -webkit-appearance: none; color: #ffffff; font-family: inherit; font-size: 13px; font-weight: 700; background: rgba(255, 255, 255, 0.09); border: 1px solid rgba(255, 255, 255, 0.11); border-radius: 12px; outline: none; cursor: pointer; transform: none; transition: background-color 0.18s ease, border-color 0.18s ease; } .gulum-mayin__flag-button > .gulum-mayin__icon { width: 19px; height: 19px; color: #ff6078; } .gulum-mayin__flag-button:hover { background: rgba(255, 255, 255, 0.14); } .gulum-mayin__flag-button:active, .gulum-mayin__flag-button:focus { transform: none; } .gulum-mayin__flag-button.is-active { background: linear-gradient(135deg, #dc2626, #f43f5e); border-color: transparent; } .gulum-mayin__flag-button.is-active > .gulum-mayin__icon { color: #ffffff; } .gulum-mayin__status { display: flex; align-items: center; justify-content: center; min-height: 42px; margin-bottom: 13px; padding: 9px 12px; color: #ffffff; font-size: 13px; font-weight: 700; line-height: 1.4; background: rgba(255, 255, 255, 0.06); border-radius: 12px; } .gulum-mayin__board { display: grid; grid-template-columns: repeat(9, minmax(0, 1fr)); gap: 3px; width: 100%; margin: 0 auto; padding: 7px; touch-action: manipulation; user-select: none; -webkit-user-select: none; background: rgba(7, 6, 20, 0.4); border: 1px solid rgba(255, 255, 255, 0.09); border-radius: 14px; } .gulum-mayin__cell { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; min-width: 0; aspect-ratio: 1 / 1; margin: 0; padding: 0; overflow: hidden; appearance: none; -webkit-appearance: none; color: #17152d; font-family: Arial, Helvetica, sans-serif; font-size: clamp(12px, 4.2vw, 20px); font-weight: 900; line-height: 1; background: linear-gradient(145deg, #514d7e, #37345f); border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 5px; outline: none; box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.14), inset -1px -1px 0 rgba(0, 0, 0, 0.18); cursor: pointer; transform: none; transition: background-color 0.12s ease, border-color 0.12s ease; } .gulum-mayin__cell .gulum-mayin__icon { width: 58%; height: 58%; } .gulum-mayin__cell:hover:not(.is-open):not(:disabled) { background: #454174; border-color: rgba(255, 255, 255, 0.22); } .gulum-mayin__cell:active, .gulum-mayin__cell:focus, .gulum-mayin__cell:focus-visible { transform: none; } .gulum-mayin__cell:focus-visible { border-color: #ffffff; box-shadow: 0 0 0 2px rgba(168, 85, 247, 0.75); } .gulum-mayin__cell.is-open { color: #17152d; background: #e9e8f2; border-color: rgba(23, 21, 45, 0.12); box-shadow: none; cursor: default; } .gulum-mayin__cell.is-flagged { color: #ff6078; background: linear-gradient(145deg, #70689b, #443d70); } .gulum-mayin__cell.is-mine { color: #ffffff; background: var(--mayin-red); border-color: #fca5a5; } .gulum-mayin__cell.is-exploded { color: #ffffff; background: #b91c1c; box-shadow: inset 0 0 0 2px #ffffff, 0 0 13px rgba(239, 68, 68, 0.65); } .gulum-mayin__cell.is-wrong { color: #ffffff; background: #7f1d1d; } .gulum-mayin__cell[data-number="1"] { color: #2563eb; } .gulum-mayin__cell[data-number="2"] { color: #15803d; } .gulum-mayin__cell[data-number="3"] { color: #dc2626; } .gulum-mayin__cell[data-number="4"] { color: #6d28d9; } .gulum-mayin__cell[data-number="5"] { color: #9f1239; } .gulum-mayin__cell[data-number="6"] { color: #0f766e; } .gulum-mayin__cell[data-number="7"] { color: #111827; } .gulum-mayin__cell[data-number="8"] { color: #475569; } .gulum-mayin__instructions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin-top: 17px; } .gulum-mayin__instruction { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 12px; text-align: left; background: rgba(255, 255, 255, 0.06); border-radius: 11px; } .gulum-mayin__instruction-icon { display: flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 28px; height: 28px; color: #c084fc; } .gulum-mayin__instruction-icon .gulum-mayin__icon { width: 24px; height: 24px; } .gulum-mayin__instruction p { margin: 0; padding: 0; color: var(--mayin-muted); font-size: 11px; line-height: 1.5; } @media (max-width: 520px) { .gulum-mayin { padding: 22px 8px; } .gulum-mayin__container { padding: 22px 12px; border-radius: 20px; } .gulum-mayin__board { gap: 2px; padding: 5px; border-radius: 11px; } .gulum-mayin__cell { border-radius: 4px; font-size: clamp(11px, 4.5vw, 18px); } .gulum-mayin__instructions { grid-template-columns: 1fr; } } @media (max-width: 380px) { .gulum-mayin__toolbar { grid-template-columns: 1fr 56px 1fr; gap: 6px; padding: 8px; } .gulum-mayin__restart { width: 50px; height: 50px; } .gulum-mayin__face-icon { width: 29px; height: 29px; } .gulum-mayin__counter { min-height: 49px; padding: 5px; } .gulum-mayin__counter strong { font-size: 20px; } } @media (prefers-reduced-motion: reduce) { .gulum-mayin__restart, .gulum-mayin__flag-button, .gulum-mayin__cell { transition: none; } } (() => { "use strict"; const gameRoot = document.querySelector(".gulum-mayin"); if (!gameRoot) { return; } const ROWS = 9; const COLUMNS = 9; const MINE_COUNT = 10; const boardElement = gameRoot.querySelector("#gulumMayinBoard"); const restartButton = gameRoot.querySelector("#gulumMayinRestart"); const faceElement = gameRoot.querySelector("#gulumMayinFace"); const counterElement = gameRoot.querySelector("#gulumMayinCounter"); const timerElement = gameRoot.querySelector("#gulumMayinTimer"); const statusElement = gameRoot.querySelector("#gulumMayinStatus"); const flagButton = gameRoot.querySelector("#gulumMayinFlagButton"); const flagText = gameRoot.querySelector("#gulumMayinFlagText"); let board = []; let cellElements = []; let firstMove = true; let gameActive = true; let flagMode = false; let openedCount = 0; let flagCount = 0; let elapsedSeconds = 0; let timerInterval = null; function getIconMarkup(iconName, extraClass = "") { return ` `; } function initializeGame() { stopTimer(); board = []; cellElements = []; firstMove = true; gameActive = true; flagMode = false; openedCount = 0; flagCount = 0; elapsedSeconds = 0; faceElement.innerHTML = getIconMarkup( "smile", "gulum-mayin__face-icon" ); statusElement.textContent = "Başlamak için bir kutuya dokun."; createEmptyBoard(); renderBoard(); updateTimer(); updateMineCounter(); updateFlagMode(); } function createEmptyBoard() { for (let row = 0; row < ROWS; row++) { const boardRow = []; for ( let column = 0; column < COLUMNS; column++ ) { boardRow.push({ row, column, isMine: false, isOpen: false, isFlagged: false, nearbyMines: 0 }); } board.push(boardRow); } } function renderBoard() { boardElement.innerHTML = ""; const fragment = document.createDocumentFragment(); board.forEach(row => { row.forEach(cellData => { const button = document.createElement("button"); button.type = "button"; button.className = "gulum-mayin__cell"; button.dataset.row = String(cellData.row); button.dataset.column = String(cellData.column); button.setAttribute( "role", "gridcell" ); button.setAttribute( "aria-label", `${cellData.row + 1}. satır, ${ cellData.column + 1 }. sütun` ); button.addEventListener( "click", handleCellClick ); button.addEventListener( "contextmenu", handleRightClick ); fragment.appendChild(button); cellElements.push(button); }); }); boardElement.appendChild(fragment); } function handleCellClick(event) { if (!gameActive) { return; } const button = event.currentTarget; const row = Number(button.dataset.row); const column = Number(button.dataset.column); if (flagMode) { toggleFlag(row, column); } else { openCell(row, column); } } function handleRightClick(event) { event.preventDefault(); if (!gameActive) { return; } const button = event.currentTarget; toggleFlag( Number(button.dataset.row), Number(button.dataset.column) ); } function openCell(row, column) { const cellData = board[row][column]; if ( !gameActive || cellData.isOpen || cellData.isFlagged ) { return; } if (firstMove) { placeMines(row, column); calculateNearbyMines(); startTimer(); firstMove = false; statusElement.textContent = "Mayınlara dikkat ederek güvenli kutuları aç."; } if (cellData.isMine) { cellData.isOpen = true; updateCellDisplay(cellData); finishGame(false, cellData); return; } revealSafeArea(row, column); checkWin(); } function placeMines(safeRow, safeColumn) { const protectedCells = new Set(); getNeighbors( safeRow, safeColumn, true ).forEach(position => { protectedCells.add( getFlatIndex( position.row, position.column ) ); }); const availableCells = []; for (let row = 0; row < ROWS; row++) { for ( let column = 0; column < COLUMNS; column++ ) { const index = getFlatIndex(row, column); if (!protectedCells.has(index)) { availableCells.push(index); } } } shuffleArray(availableCells); availableCells .slice(0, MINE_COUNT) .forEach(index => { const row = Math.floor(index / COLUMNS); const column = index % COLUMNS; board[row][column].isMine = true; }); } function calculateNearbyMines() { board.forEach(row => { row.forEach(cellData => { if (cellData.isMine) { return; } cellData.nearbyMines = getNeighbors( cellData.row, cellData.column ).filter(position => { return board[ position.row ][position.column].isMine; }).length; }); }); } function revealSafeArea( startRow, startColumn ) { const queue = [ { row: startRow, column: startColumn } ]; const visited = new Set(); while (queue.length > 0) { const current = queue.shift(); const key = `${current.row}-${current.column}`; if (visited.has(key)) { continue; } visited.add(key); const cellData = board[ current.row ][current.column]; if ( cellData.isOpen || cellData.isFlagged || cellData.isMine ) { continue; } cellData.isOpen = true; openedCount++; updateCellDisplay(cellData); if (cellData.nearbyMines === 0) { getNeighbors( current.row, current.column ).forEach(position => { const neighbor = board[ position.row ][position.column]; if ( !neighbor.isOpen && !neighbor.isFlagged && !neighbor.isMine ) { queue.push(position); } }); } } } function toggleFlag(row, column) { const cellData = board[row][column]; if ( !gameActive || cellData.isOpen ) { return; } if (!cellData.isFlagged) { if (flagCount >= MINE_COUNT) { statusElement.textContent = "Kullanabileceğin bütün bayrakları yerleştirdin."; return; } cellData.isFlagged = true; flagCount++; } else { cellData.isFlagged = false; flagCount--; } updateCellDisplay(cellData); updateMineCounter(); } function updateCellDisplay(cellData) { const cellElement = getCellElement( cellData.row, cellData.column ); if (!cellElement) { return; } cellElement.classList.remove( "is-open", "is-flagged", "is-mine", "is-exploded", "is-wrong" ); cellElement.removeAttribute( "data-number" ); cellElement.innerHTML = ""; if ( cellData.isFlagged && !cellData.isOpen ) { cellElement.classList.add( "is-flagged" ); cellElement.innerHTML = getIconMarkup("flag"); cellElement.setAttribute( "aria-label", "Bayrak yerleştirilmiş kutu" ); return; } if (!cellData.isOpen) { return; } cellElement.classList.add("is-open"); cellElement.disabled = true; if (cellData.isMine) { cellElement.classList.add("is-mine"); cellElement.innerHTML = getIconMarkup("bomb"); cellElement.setAttribute( "aria-label", "Mayın bulunan kutu" ); return; } if (cellData.nearbyMines > 0) { cellElement.textContent = String(cellData.nearbyMines); cellElement.dataset.number = String(cellData.nearbyMines); cellElement.setAttribute( "aria-label", `${cellData.nearbyMines} komşu mayın` ); } else { cellElement.setAttribute( "aria-label", "Boş güvenli kutu" ); } } function checkWin() { const safeCellCount = ROWS * COLUMNS - MINE_COUNT; if (openedCount === safeCellCount) { finishGame(true); } } function finishGame( didWin, explodedCell = null ) { gameActive = false; stopTimer(); if (didWin) { faceElement.innerHTML = getIconMarkup( "cool", "gulum-mayin__face-icon" ); statusElement.textContent = `Tebrikler! Oyunu ${elapsedSeconds} saniyede tamamladın.`; flagCount = MINE_COUNT; board.forEach(row => { row.forEach(cellData => { if (cellData.isMine) { cellData.isFlagged = true; updateCellDisplay(cellData); } }); }); updateMineCounter(); } else { faceElement.innerHTML = getIconMarkup( "dizzy", "gulum-mayin__face-icon" ); statusElement.textContent = "Mayına bastın! Yeniden başlatmak için yüz simgesine dokun."; revealAllMines(explodedCell); } cellElements.forEach(cell => { cell.disabled = true; }); } function revealAllMines(explodedCell) { board.forEach(row => { row.forEach(cellData => { const cellElement = getCellElement( cellData.row, cellData.column ); if (cellData.isMine) { cellData.isOpen = true; updateCellDisplay(cellData); if ( explodedCell && cellData.row === explodedCell.row && cellData.column === explodedCell.column ) { cellElement.classList.add( "is-exploded" ); } } else if (cellData.isFlagged) { cellElement.classList.remove( "is-flagged" ); cellElement.classList.add( "is-wrong" ); cellElement.innerHTML = getIconMarkup("x"); } }); }); } function getNeighbors( row, column, includeCenter = false ) { const neighbors = []; for ( let rowOffset = -1; rowOffset = 0 && newColumn < COLUMNS ) { neighbors.push({ row: newRow, column: newColumn }); } } } return neighbors; } function getFlatIndex(row, column) { return row * COLUMNS + column; } function getCellElement(row, column) { return ( cellElements[ getFlatIndex(row, column) ] || null ); } function shuffleArray(items) { for ( let index = items.length - 1; index > 0; index-- ) { const randomIndex = Math.floor( Math.random() * (index + 1) ); [ items[index], items[randomIndex] ] = [ items[randomIndex], items[index] ]; } } function startTimer() { stopTimer(); timerInterval = window.setInterval(() => { elapsedSeconds++; if (elapsedSeconds >= 999) { elapsedSeconds = 999; stopTimer(); } updateTimer(); }, 1000); } function stopTimer() { if (timerInterval !== null) { window.clearInterval( timerInterval ); timerInterval = null; } } function updateTimer() { timerElement.textContent = formatCounter(elapsedSeconds); } function updateMineCounter() { counterElement.textContent = formatCounter( MINE_COUNT - flagCount ); } function formatCounter(value) { return String( Math.max( 0, Math.min(999, value) ) ).padStart(3, "0"); } function updateFlagMode() { flagButton.classList.toggle( "is-active", flagMode ); flagButton.setAttribute( "aria-pressed", String(flagMode) ); flagText.textContent = flagMode ? "Bayrak Modu: Açık" : "Bayrak Modu: Kapalı"; } restartButton.addEventListener( "click", initializeGame ); flagButton.addEventListener( "click", () => { if (!gameActive) { return; } flagMode = !flagMode; updateFlagMode(); statusElement.textContent = flagMode ? "Bayrak modu açık. İşaretlemek istediğin kutuya dokun." : "Bayrak modu kapalı. Güvenli kutuları açmaya devam et."; } ); initializeGame(); })();