{"id":73,"date":"2026-03-16T13:21:24","date_gmt":"2026-03-16T13:21:24","guid":{"rendered":"https:\/\/tools.sanepo.com\/?post_type=tool&#038;p=73"},"modified":"2026-03-16T13:21:25","modified_gmt":"2026-03-16T13:21:25","slug":"online-dns-lookup","status":"publish","type":"tool","link":"https:\/\/tools.sanepo.com\/id\/features\/online-dns-lookup\/","title":{"rendered":"Free Online DNS Lookup Tool \u2013 Analyze DNS Records &amp; Propagation"},"content":{"rendered":"\n<style>\n    @import url('https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700;800&display=swap');\n\n    \/* CSS Variables - Light Mode Default *\/\n    #wpnt-dns-lookup {\n        --bg-primary: #ffffff;\n        --bg-secondary: #f8fafc;\n        --border-color: #e2e8f0;\n        --text-main: #0f172a;\n        --text-muted: #64748b;\n        --accent-color: #4361ee;\n        --accent-hover: #3a56d4;\n        --card-shadow: 0 4px 15px -3px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.02);\n        --transition: all 0.2s ease;\n        \n        --wpnt-success: #10b981;\n        --wpnt-danger: #ef4444;\n        --wpnt-radius-lg: 16px;\n        --wpnt-radius-md: 12px;\n        --wpnt-radius-sm: 8px;\n        \n        font-family: 'Inter', sans-serif;\n        color: var(--text-main);\n        width: 100%;\n        margin: 20px auto;\n        background: var(--bg-primary);\n        border: 1px solid var(--border-color);\n        border-radius: var(--wpnt-radius-lg);\n        box-shadow: var(--card-shadow);\n        padding: 32px;\n        box-sizing: border-box;\n    }\n\n    \/* SMART THEME SYNC: \n       Prioritize site's specific dark class, then fallback to OS preference ONLY IF site is not explicitly light *\/\n    html.dark #wpnt-dns-lookup,\n    body.dark #wpnt-dns-lookup,\n    [data-theme=\"dark\"] #wpnt-dns-lookup {\n        --bg-primary: #0f172a;\n        --bg-secondary: #1e293b;\n        --border-color: #334155;\n        --text-main: #f1f5f9;\n        --text-muted: #94a3b8;\n        --card-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3);\n    }\n\n    @media (prefers-color-scheme: dark) {\n        html:not(.light):not([data-theme=\"light\"]) #wpnt-dns-lookup {\n            --bg-primary: #0f172a;\n            --bg-secondary: #1e293b;\n            --border-color: #334155;\n            --text-main: #f1f5f9;\n            --text-muted: #94a3b8;\n            --card-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3);\n        }\n    }\n\n    #wpnt-dns-lookup * { box-sizing: border-box; }\n\n    \/* Header *\/\n    #wpnt-dns-lookup .wpnt-header { margin-bottom: 24px; padding-bottom: 16px; border-bottom: 1px solid var(--border-color); }\n    #wpnt-dns-lookup h3 { margin: 0 0 4px 0; font-size: 1.5rem; font-weight: 800; color: var(--accent-color); letter-spacing: -0.02em; }\n    #wpnt-dns-lookup p { margin: 0; font-size: 0.9rem; color: var(--text-muted); }\n\n    \/* Input *\/\n    #wpnt-dns-lookup .input-group { margin-bottom: 24px; }\n    #wpnt-dns-lookup input[type=\"text\"] {\n        width: 100%;\n        padding: 16px 20px;\n        border: 2px solid var(--border-color);\n        border-radius: var(--wpnt-radius-md);\n        background: var(--bg-secondary);\n        color: var(--text-main);\n        font-size: 1rem;\n        outline: none;\n        transition: var(--transition);\n    }\n    #wpnt-dns-lookup input[type=\"text\"]:focus { border-color: var(--accent-color); background: var(--bg-primary); }\n\n    \/* Checkboxes *\/\n    #wpnt-dns-lookup .section-label { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-muted); margin-bottom: 12px; display: block; }\n    #wpnt-dns-lookup .checkbox-grid {\n        display: grid;\n        grid-template-columns: repeat(4, 1fr);\n        gap: 12px;\n        background: var(--bg-secondary);\n        padding: 16px;\n        border-radius: var(--wpnt-radius-md);\n        margin-bottom: 24px;\n        border: 1px solid var(--border-color);\n    }\n    #wpnt-dns-lookup .check-item { display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 0.85rem; font-weight: 600; }\n    #wpnt-dns-lookup .check-item input { width: 16px; height: 16px; accent-color: var(--accent-color); cursor: pointer; }\n\n    \/* Toggle Propagation *\/\n    #wpnt-dns-lookup .toggle-box {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        padding: 16px;\n        background: var(--bg-secondary);\n        border-radius: var(--wpnt-radius-md);\n        margin-bottom: 24px;\n        border: 1px dashed var(--accent-color);\n    }\n    #wpnt-dns-lookup .switch { position: relative; display: inline-block; width: 44px; height: 24px; }\n    #wpnt-dns-lookup .switch input { opacity: 0; width: 0; height: 0; }\n    #wpnt-dns-lookup .slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: var(--border-color); transition: .4s; border-radius: 34px; }\n    #wpnt-dns-lookup .slider:before { position: absolute; content: \"\"; height: 18px; width: 18px; left: 3px; bottom: 3px; background-color: white; transition: .4s; border-radius: 50%; }\n    #wpnt-dns-lookup input:checked + .slider { background-color: var(--accent-color); }\n    #wpnt-dns-lookup input:checked + .slider:before { transform: translateX(20px); }\n\n    \/* Buttons & Progress *\/\n    #wpnt-dns-lookup .button-group {\n        display: flex;\n        gap: 12px;\n        width: 100%;\n    }\n    #wpnt-dns-lookup .btn-primary, #wpnt-dns-lookup .btn-danger {\n        flex: 1;\n        color: white;\n        border: none;\n        padding: 16px;\n        border-radius: var(--wpnt-radius-md);\n        font-weight: 700;\n        font-size: 1rem;\n        cursor: pointer;\n        transition: var(--transition);\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        gap: 8px;\n    }\n    #wpnt-dns-lookup .btn-primary { background: var(--accent-color); }\n    #wpnt-dns-lookup .btn-primary:hover { background: var(--accent-hover); transform: translateY(-2px); }\n    \n    #wpnt-dns-lookup .btn-danger { background: var(--wpnt-danger); display: none; }\n    #wpnt-dns-lookup .btn-danger:hover { background: #dc2626; transform: translateY(-2px); }\n\n    #wpnt-dns-lookup .progress-wrapper {\n        width: 100%;\n        height: 6px;\n        background: var(--bg-secondary);\n        border-radius: 10px;\n        margin-top: 20px;\n        overflow: hidden;\n        display: none;\n        border: 1px solid var(--border-color);\n    }\n    #wpnt-dns-lookup .progress-fill {\n        height: 100%;\n        width: 0%;\n        background: linear-gradient(90deg, var(--accent-color), #7209b7);\n        transition: width 0.3s ease;\n    }\n\n    \/* Actions *\/\n    #wpnt-dns-lookup .actions-bar { display: none; justify-content: flex-end; gap: 10px; margin-top: 20px; margin-bottom: 20px; }\n    #wpnt-dns-lookup .btn-sm { background: var(--bg-secondary); border: 1px solid var(--border-color); padding: 8px 16px; border-radius: var(--wpnt-radius-sm); font-size: 0.8rem; font-weight: 600; cursor: pointer; color: var(--text-main); transition: var(--transition); }\n    #wpnt-dns-lookup .btn-sm:hover { border-color: var(--accent-color); }\n\n    \/* Results Cards *\/\n    #wpnt-dns-lookup .results-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; margin-top: 20px; }\n    #wpnt-dns-lookup .res-card {\n        background: var(--bg-primary);\n        border: 1px solid var(--border-color);\n        border-radius: var(--wpnt-radius-md);\n        padding: 16px;\n        box-shadow: var(--card-shadow);\n        display: flex;\n        flex-direction: column;\n        animation: fadeIn 0.3s ease;\n    }\n    @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }\n    \n    #wpnt-dns-lookup .res-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--border-color); }\n    #wpnt-dns-lookup .res-title { font-weight: 700; font-size: 0.8rem; text-transform: uppercase; color: var(--text-muted); }\n    #wpnt-dns-lookup .status-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--border-color); transition: background 0.3s; }\n    #wpnt-dns-lookup .status-dot.done { background: var(--wpnt-success); box-shadow: 0 0 8px var(--wpnt-success); }\n    #wpnt-dns-lookup .status-dot.error { background: var(--wpnt-danger); }\n    #wpnt-dns-lookup .status-dot.aborted { background: var(--text-muted); }\n    \n    #wpnt-dns-lookup .record-badge { font-size: 0.65rem; font-weight: 800; margin: 8px 0 4px; color: var(--text-muted); letter-spacing: 0.05em; }\n    #wpnt-dns-lookup .record-val { \n        background: var(--bg-secondary); \n        padding: 8px 12px; \n        border-radius: 6px; \n        font-family: 'SFMono-Regular', Consolas, monospace; \n        font-size: 0.85rem; \n        word-break: break-all; \n        margin-bottom: 6px;\n        border-left: 3px solid var(--accent-color);\n        color: var(--text-main);\n    }\n    #wpnt-dns-lookup .empty-record { font-size: 0.8rem; opacity: 0.5; padding: 4px 0; font-style: italic; }\n\n    @media (max-width: 640px) {\n        #wpnt-dns-lookup .checkbox-grid { grid-template-columns: repeat(2, 1fr); }\n    }\n<\/style>\n\n<div id=\"wpnt-dns-lookup\">\n    <div class=\"wpnt-header\">\n        <h3>Sanepo DNS Lookup<\/h3>\n        <p>Analyze propagation and DNS integrity instantly<\/p>\n    <\/div>\n\n    <div class=\"input-group\">\n        <input type=\"text\" id=\"sanepo-domain\" placeholder=\"Enter domain (e.g. example.com)\" autocomplete=\"off\" spellcheck=\"false\">\n    <\/div>\n\n    <span class=\"section-label\">DNS Record Types<\/span>\n    <div class=\"checkbox-grid\" id=\"sanepo-types\">\n        <label class=\"check-item\"><input type=\"checkbox\" value=\"A\" checked> A<\/label>\n        <label class=\"check-item\"><input type=\"checkbox\" value=\"AAAA\"> AAAA<\/label>\n        <label class=\"check-item\"><input type=\"checkbox\" value=\"MX\" checked> MX<\/label>\n        <label class=\"check-item\"><input type=\"checkbox\" value=\"TXT\"> TXT<\/label>\n        <label class=\"check-item\"><input type=\"checkbox\" value=\"CNAME\"> CNAME<\/label>\n        <label class=\"check-item\"><input type=\"checkbox\" value=\"NS\"> NS<\/label>\n        <label class=\"check-item\"><input type=\"checkbox\" value=\"SOA\"> SOA<\/label>\n        <label class=\"check-item\"><input type=\"checkbox\" value=\"PTR\"> PTR<\/label>\n    <\/div>\n\n    <div class=\"toggle-box\">\n        <div>\n            <div style=\"font-weight: 700; font-size: 0.95rem; color: var(--text-main);\">Global Propagation Mode<\/div>\n            <div style=\"font-size: 0.8rem; color: var(--text-muted);\">Query 10+ edge locations worldwide<\/div>\n        <\/div>\n        <label class=\"switch\">\n            <input type=\"checkbox\" id=\"sanepo-prop\">\n            <span class=\"slider\"><\/span>\n        <\/label>\n    <\/div>\n\n    <div class=\"button-group\">\n        <button class=\"btn-primary\" id=\"sanepo-scan\">\n            <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"11\" cy=\"11\" r=\"8\"><\/circle><line x1=\"21\" y1=\"21\" x2=\"16.65\" y2=\"16.65\"><\/line><\/svg>\n            Lookup Records\n        <\/button>\n        <button class=\"btn-danger\" id=\"sanepo-stop\">\n            <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"6\" y=\"6\" width=\"12\" height=\"12\"><\/rect><\/svg>\n            Stop Scan\n        <\/button>\n    <\/div>\n\n    <div class=\"progress-wrapper\" id=\"sanepo-progress-wrap\">\n        <div class=\"progress-fill\" id=\"sanepo-progress\"><\/div>\n    <\/div>\n\n    <div class=\"actions-bar\" id=\"sanepo-actions\">\n        <button class=\"btn-sm\" id=\"btn-copy\">Copy Summary<\/button>\n        <button class=\"btn-sm\" id=\"btn-export\">Export JSON<\/button>\n    <\/div>\n\n    <div class=\"results-grid\" id=\"sanepo-results\"><\/div>\n<\/div>\n\n<script>\n(function() {\n    const btnScan = document.getElementById('sanepo-scan');\n    const btnStop = document.getElementById('sanepo-stop');\n    const inputDomain = document.getElementById('sanepo-domain');\n    const typeGrid = document.getElementById('sanepo-types');\n    const toggleProp = document.getElementById('sanepo-prop');\n    const progressWrap = document.getElementById('sanepo-progress-wrap');\n    const progressBar = document.getElementById('sanepo-progress');\n    const resultsGrid = document.getElementById('sanepo-results');\n    const actionsBar = document.getElementById('sanepo-actions');\n\n    const REGIONAL_SERVERS = [\n        { id: 'cf', name: 'Cloudflare (US)', url: 'https:\/\/cloudflare-dns.com\/dns-query' },\n        { id: 'gg', name: 'Google DNS (US)', url: 'https:\/\/dns.google\/resolve' },\n        { id: 'od', name: 'OpenDNS (EU)', url: 'https:\/\/doh.opendns.com\/dns-query' }\n    ];\n\n    const GLOBAL_SERVERS = [\n        ...REGIONAL_SERVERS,\n        { id: 'q9', name: 'Quad9 (Global)', url: 'https:\/\/dns.quad9.net:5053\/dns-query' },\n        { id: 'al', name: 'Alibaba (CN)', url: 'https:\/\/dns.alidns.com\/resolve' },\n        { id: 'ag', name: 'AdGuard (DE)', url: 'https:\/\/dns.adguard.com\/resolve' },\n        { id: 'nd', name: 'NextDNS (Global)', url: 'https:\/\/dns.nextdns.io\/dns-query' },\n        { id: 'cm', name: 'Comodo (US)', url: 'https:\/\/doh.comodo.net\/dns-query' }\n    ];\n\n    let sessionData = [];\n    let scanController = null; \/\/ Controller for aborting requests\n\n    \/\/ Progressive Fetch (Lightning Fast)\n    async function startLightningScan() {\n        let domain = inputDomain.value.trim().toLowerCase();\n        if (!domain) return;\n        domain = domain.replace(\/^https?:\\\/\\\/\/, '').split('\/')[0];\n\n        const selectedTypes = Array.from(typeGrid.querySelectorAll('input:checked')).map(c => c.value);\n        if (selectedTypes.length === 0) return;\n\n        const isProp = toggleProp.checked;\n        const activeServers = isProp ? GLOBAL_SERVERS : REGIONAL_SERVERS;\n        const typesToRun = isProp ? [selectedTypes[0]] : selectedTypes;\n\n        \/\/ Init AbortController\n        if (scanController) scanController.abort();\n        scanController = new AbortController();\n        const signal = scanController.signal;\n\n        \/\/ Reset UI\n        btnScan.style.display = 'none';\n        btnStop.style.display = 'flex';\n        progressWrap.style.display = 'block';\n        progressBar.style.width = '0%';\n        actionsBar.style.display = 'none';\n        resultsGrid.innerHTML = '';\n        sessionData = [];\n\n        let totalTasks = activeServers.length * typesToRun.length;\n        let completedTasks = 0;\n\n        \/\/ 1. Buat kerangka UI langsung agar terasa instan\n        activeServers.forEach(server => {\n            const card = document.createElement('div');\n            card.className = 'res-card';\n            card.id = `card-${server.id}`;\n            card.innerHTML = `\n                <div class=\"res-header\">\n                    <span class=\"res-title\">${server.name}<\/span>\n                    <div class=\"status-dot\" id=\"dot-${server.id}\"><\/div>\n                <\/div>\n                <div id=\"body-${server.id}\"><\/div>\n            `;\n            resultsGrid.appendChild(card);\n        });\n\n        \/\/ 2. Tembak API secara Asynchronous Paralel dengan Signal\n        activeServers.forEach(server => {\n            typesToRun.forEach(type => {\n                const sep = server.url.includes('?') ? '&' : '?';\n                const url = `${server.url}${sep}name=${domain}&type=${type}`;\n                \n                fetch(url, { headers: { 'Accept': 'application\/dns-json' }, signal })\n                    .then(res => res.json())\n                    .then(data => handleResult(server, type, data, true, false))\n                    .catch(err => {\n                        const isAborted = err.name === 'AbortError';\n                        handleResult(server, type, null, false, isAborted);\n                    })\n                    .finally(() => {\n                        completedTasks++;\n                        progressBar.style.width = `${(completedTasks \/ totalTasks) * 100}%`;\n                        if (completedTasks === totalTasks) finishScan();\n                    });\n            });\n        });\n    }\n\n    function handleResult(server, type, data, success, isAborted) {\n        const bodyEl = document.getElementById(`body-${server.id}`);\n        const dotEl = document.getElementById(`dot-${server.id}`);\n        \n        let htmlBlock = `<div class=\"record-badge\">TYPE: ${type}<\/div>`;\n        \n        if (success && data && data.Answer && data.Answer.length > 0) {\n            dotEl.classList.add('done');\n            data.Answer.forEach(ans => {\n                htmlBlock += `<div class=\"record-val\">${ans.data.replace(\/^\"|\"$\/g, '')}<\/div>`;\n            });\n        } else {\n            if (isAborted) {\n                dotEl.classList.add('aborted');\n                htmlBlock += `<div class=\"empty-record\">Scan aborted<\/div>`;\n            } else if (!success) {\n                dotEl.classList.add('error');\n                htmlBlock += `<div class=\"empty-record\">No records found<\/div>`;\n            } else {\n                dotEl.classList.add('done');\n                htmlBlock += `<div class=\"empty-record\">No records found<\/div>`;\n            }\n        }\n        \n        bodyEl.innerHTML += htmlBlock;\n\n        if(!isAborted) {\n            sessionData.push({ provider: server.name, type: type, data: data, success: success });\n        }\n    }\n\n    function finishScan() {\n        btnScan.style.display = 'flex';\n        btnStop.style.display = 'none';\n        actionsBar.style.display = 'flex';\n        scanController = null;\n        setTimeout(() => { progressWrap.style.display = 'none'; }, 1000);\n    }\n\n    \/\/ Stop Button Action\n    btnStop.addEventListener('click', () => {\n        if (scanController) {\n            scanController.abort(); \/\/ Membatalkan semua fetch yang belum selesai\n        }\n    });\n\n    \/\/ Propagation logic (force 1 selection)\n    toggleProp.addEventListener('change', () => {\n        if (toggleProp.checked) {\n            let found = false;\n            typeGrid.querySelectorAll('input').forEach(c => {\n                if (c.checked && !found) found = true;\n                else if (found) c.checked = false;\n            });\n        }\n    });\n\n    \/\/ Export & Copy\n    document.getElementById('btn-export').addEventListener('click', () => {\n        if (sessionData.length === 0) return alert('No data to export.');\n        const blob = new Blob([JSON.stringify(sessionData, null, 2)], {type: 'application\/json'});\n        const a = document.createElement('a');\n        a.href = URL.createObjectURL(blob);\n        a.download = `sanepo-dns-${Date.now()}.json`;\n        a.click();\n    });\n\n    document.getElementById('btn-copy').addEventListener('click', () => {\n        let text = `Sanepo DNS Lookup (${inputDomain.value})\\n\\n`;\n        document.querySelectorAll('.res-card').forEach(card => {\n            const title = card.querySelector('.res-title').innerText;\n            const records = Array.from(card.querySelectorAll('.record-val')).map(el => el.innerText).join(', ') || 'No records \/ Aborted';\n            text += `[${title}]\\nResult: ${records}\\n\\n`;\n        });\n        const area = document.createElement('textarea');\n        area.value = text;\n        document.body.appendChild(area);\n        area.select();\n        document.execCommand('copy');\n        document.body.removeChild(area);\n        alert('Results copied to clipboard!');\n    });\n\n    btnScan.addEventListener('click', startLightningScan);\n    inputDomain.addEventListener('keypress', (e) => e.key === 'Enter' && startLightningScan());\n})();\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>Sanepo DNS Lookup Analyze propagation and DNS integrity instantly DNS Record Types A AAAA MX TXT CNAME NS SOA PTR Global Propagation Mode Query 10+ edge locations worldwide Lookup Records Stop Scan Copy Summary Export JSON<\/p>\n","protected":false},"featured_media":0,"template":"","meta":[],"class_list":["post-73","tool","type-tool","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/tools.sanepo.com\/id\/wp-json\/wp\/v2\/tool\/73","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tools.sanepo.com\/id\/wp-json\/wp\/v2\/tool"}],"about":[{"href":"https:\/\/tools.sanepo.com\/id\/wp-json\/wp\/v2\/types\/tool"}],"wp:attachment":[{"href":"https:\/\/tools.sanepo.com\/id\/wp-json\/wp\/v2\/media?parent=73"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}