Spis treści

Zestaw narzędzi do konwersji

W miarę zaawansowane narzędzie online, które służy do wykonywania obliczeń arytmetycznych na liczbach w różnych systemach liczbowych (binarnym, ósemkowym, dziesiętnym i szesnastkowym) oraz do konwersji między tymi systemami.

Umożliwia także zamianę tekstu (ASCII) na postać binarną i odwrotnie.

Jest przydatna dla programistów, studentów informatyki, elektroników oraz wszystkich osób zainteresowanych matematyką i technologiami cyfrowymi.

Kalkulator arytmetyczny międzysystemowy

Kalkulator Arytmetyczny Międzysystemowy to zaawansowane narzędzie matematyczne, które pozwala wykonywać operacje arytmetyczne (dodawanie, odejmowanie, mnożenie, dzielenie) na liczbach zapisanych w różnych systemach liczbowych.

Użytkownik może wybrać system dla pierwszej i drugiej liczby (binarny, ósemkowy, dziesiętny, szesnastkowy), operację do wykonania oraz system, w którym ma być wyświetlony wynik.

Do czego służy?

- Wykonywanie obliczeń na liczbach w systemie binarnym, dziesiętnym i szesnastkowym
- Możliwość mieszania systemów – np. dodawanie liczby binarnej do dziesiętnej
- Konwersja wyniku do wybranego systemu liczbowego
- Idealny dla programistów, elektroników i studentów kierunków technicznych

Przykład użycia:

Chcesz dodać liczbę binarną 1010 (czyli 10 w dziesiętnym) do liczby szesnastkowej 1F (czyli 31 w dziesiętnym). Wynik w systemie dziesiętnym to 41, a w systemie szesnastkowym to 29. Kalkulator wykona to automatycznie.

Konwerter Systemów Liczbowych

Konwerter Systemów Liczbowych to narzędzie do konwersji liczb między trzema podstawowymi systemami: binarnym (podstawa 2), dziesiętnym (podstawa 10) i szesnastkowym (podstawa 16). Dla każdego systemu dostępne są przyciski do konwersji na pozostałe dwa systemy.

Do czego służy?

- Szybkie przeliczanie liczb między różnymi systemami
- Sprawdzanie poprawności konwersji wykonanych ręcznie
- Nauka i zrozumienie zasad konwersji między systemami
- Przydatne przy pracy z kodem maszynowym, adresami pamięci, konfiguracją sprzętu

Przykład użycia:

Masz liczbę dziesiętną 255 i chcesz zobaczyć, jak wygląda w systemie binarnym (11111111) i szesnastkowym (FF). Konwerter natychmiast pokaże obie wersje.

Konwerter Systemów Liczbowych

System Binarny

System Dziesiętny

System Szesnastkowy

Konwerter Tekstu ASCII na Binarny

Konwerter Tekstu ASCII na Binarny to narzędzie, które zamienia dowolny tekst (znaki ASCII) na ich reprezentację binarną (ciąg zer i jedynek) i odwrotnie. Każdy znak jest zamieniany na 8-bitowy kod binarny zgodnie ze standardem ASCII.

Do czego służy?

- Konwersja tekstu na postać binarną używaną przez komputery
- Odczytywanie zakodowanych wiadomości binarnych
- Nauka zasad kodowania znaków w systemach komputerowych
- Debugowanie i analiza danych tekstowych w programowaniu niskopoziomowym
- Zastosowania w kryptografii i bezpieczeństwie informatycznym

Przykład użycia:

Wpisujesz słowo „Hello”, a konwerter zamienia je na ciąg binarny: „01001000 01100101 01101100 01101100 01101111”. Możesz też wkleić kod binarny i odczytać tekst.

Konwerter Tekstu ASCII na Binarny

Tekst ASCII

Kod Binarny

Główne funkcjonalności:

Wykonuje operacje matematyczne (dodawanie, odejmowanie, mnożenie, dzielenie) na liczbach w różnych systemach liczbowych
Konwertuje liczby między systemami:
- Binarnym (podstawa 2)
- Dziesiętnym (podstawa 10)
- Szesnastkowym (podstawa 16)
Konwerter Tekstu ASCII na Binarny – zamienia tekst na kod binarny i odwrotnie

Wyjaśnienie systemów liczbowych:

- System Dziesiętny – podstawowy system używany na co dzień, oparty na 10 cyfrach (0-9)
- System Binarny – fundamentalny dla informatyki, używa tylko dwóch cyfr (0 i 1)
- System Szesnastkowy – powszechnie stosowany w programowaniu, używa 16 symboli (0-9, A-F)

Jak wstawić gadżet na własną stronę?

Można to zrobić ręcznie lub pobrać gotowca i go edytować jak dusza zapragnie.

Samodzielnie:

Tworzymy odpowiedni plik: index.html i wstawiamy poniższy kod

index.html


<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Kalkulator arytmetyczny</title>
<style>
@import url(https://fonts.googleapis.com/css?family=Droid+Sans+Mono);
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
body {
    font-family: 'Arial', sans-serif;
    background-color: #f0f0f0;
    line-height: 1.6;
    padding: 20px;
}
.wrapper {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 30px;
}
.content {
    width: 100%;
    max-width: 1200px;
    border-radius: 10px;
    text-align: center;
    background: white;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    overflow: hidden;
}
.content .heading {
    font-size: 24px;
    font-weight: 800;
    margin-top: 30px;
    padding: 0 20px;
}
.heading-2 {
    border-bottom: 1px solid rgb(89, 131, 114);
    text-align: center;
    padding: 10px 0;
    margin: 0 20px;
}
::-webkit-scrollbar {
width: 0px;
}
::-webkit-scrollbar-thumb:hover {
background: #555;
}
.converter-container {
    display: flex;
    flex-wrap: wrap;
}
.human, .machine {
    flex: 1;
    min-width: 300px;
    line-height: 1.5;
    overflow: auto;
}
.human .io, .machine .io {
    padding: 20px 10px 70px 20px;
    height: 300px;
    display: block;
    outline: none;
    overflow-y: auto;
    margin: 0 10px;
}
.human .io::-webkit-scrollbar, .machine .io::-webkit-scrollbar {
width: 5px;
}
.human .io::-webkit-scrollbar-thumb, .machine .io::-webkit-scrollbar-thumb {
border-radius: 3px;
    background: #ccc;
}
.human {
    background-color: #f8f8f8;
    font-size: 16px;
}
.machine {
    background-color: #18191b;
    color: #00FF99;
}
.machine .io {
    font-size: 14px;
}
.calculator {
    width: 100%;
    max-width: 1000px;
    padding: 20px;
    background-color: #fff;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    margin: 0 auto;
    border-radius: 10px;
}
.calculator-heading {
    text-align: center;
    border-bottom: 1px solid #ddd;
    padding-bottom: 15px;
    margin-bottom: 20px;
}
.choose {
    font-size: 16px !important;
    letter-spacing: 0px;
    margin-bottom: 20px;
}
.choose p {
    font-size: 18px;
    margin: 15px 0 10px;
    font-weight: bold;
}
.input {
    border: 1px solid #ddd;
    border-radius: 5px;
    height: 50px;
    width: 100%;
    margin: 5px 0;
    font-size: 16px;
    padding: 0 15px;
    outline: none;
    transition: all .2s ease-in-out;
}
.input:hover {
    border: 1px solid #bbb;
    box-shadow: inset 0px 1px 4px 0px rgba(0, 0, 0, 0.1);
}
.button {
    display: flex;
    gap: 10px;
    margin: 15px 0;
}
.button input {
    flex: 1;
    border: 1px solid #ddd;
    border-radius: 5px;
    height: 60px;
    font-size: 16px;
    text-align: center;
    padding: 10px;
    cursor: pointer;
    background-color: #4a6baf;
    color: white;
    transition: border-color .2s ease-in-out, background-color .2s, box-shadow .2s;
}
.button input:hover {
    background-color: #3a5a9f;
    box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.2);
}
.button input:active {
    transform: scale(0.98);
}
.ans {
    padding: 15px;
    word-wrap: break-word;
    width: 100%;
    min-height: 60px;
    background-color: #16161D;
    color: #00FF99;
    margin-top: 20px;
    border-radius: 5px;
    font-size: 18px;
}
form.radio-group {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 15px;
}
label {
    cursor: pointer;
    font-weight: 500;
    position: relative;
    overflow: hidden;
    margin-bottom: 0.375em;
    flex: 1;
    min-width: 120px;
}
label input {
    position: absolute;
    left: -9999px;
}
label input:checked + span {
    background-color: #d6d6e5;
}
label input:checked + span:before {
    box-shadow: inset 0 0 0 0.4375em #4a6baf;
}
label span {
    display: flex;
    align-items: center;
    padding: 0.375em 0.75em 0.375em 0.375em;
    border-radius: 99em;
    transition: 0.25s ease;
    justify-content: center;
}
label span:hover {
    background-color: #f0f0f5;
}
label span:before {
    display: flex;
    flex-shrink: 0;
    content: "";
    background-color: #fff;
    width: 1.5em;
    height: 1.5em;
    border-radius: 50%;
    margin-right: 0.375em;
    transition: 0.25s ease;
    box-shadow: inset 0 0 0 0.125em #4a6baf;
}
.output {
    overflow: auto;
    margin-bottom: 1em !important;
    font-size: 1rem;
    color: #00FF99;
    width: 100%;
    min-height: 40px;
    background-color: #16161D;
    padding: 10px;
    border-radius: 5px;
}
.section input {
    outline: none;
    width: 100%;
    padding: 10px;
    margin: 10px 0;
    border: 1px solid #ddd;
    border-radius: 5px;
}
.output::-webkit-scrollbar {
width: 1px !important;
}
.output::-webkit-scrollbar-thumb {
background: #00FF99;
}
.output::-webkit-scrollbar-thumb:hover {
background: rgb(125, 179, 155);
}
.section {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 200px;
    padding: 15px;
    background: #f8f8f8;
    border-radius: 8px;
    margin: 10px;
}
.title {
    text-align: center;
    margin: 20px 0;
}
.container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}
.btn {
    padding: 10px 5px;
    font-size: 1rem;
    background: #4a6baf;
    color: white;
    outline: none;
    border: none;
    margin: .4em 0;
    width: 100%;
    transition: background-color .2s ease-in-out;
    border-radius: 5px;
    cursor: pointer;
}
.btn:last-child {
    background: #3a5a9f;
}
.btn:hover {
    background: #5a7bbf;
}
.btns {
    display: flex;
    width: 100%;
    gap: 10px;
}
.selectable {
    -webkit-touch-callout: all;
    -webkit-user-select: all;
    -khtml-user-select: all;
    -moz-user-select: all;
    -ms-user-select: all;
    user-select: all;
}

@media only screen and (max-width: 900px) {
    .container {
        display: grid;
        grid-template-columns: 1fr;
        gap: 15px;
    }
    .converter-container {
        flex-direction: column;
    }
    h1, h2 {
        font-size: 1.3rem;
    }
    .section {
        min-width: 100%;
        margin: 5px 0;
    }
    .calculator {
        padding: 15px;
    }
    .choose p {
        font-size: 16px;
    }
    form.radio-group {
        justify-content: center;
    }
    label {
        min-width: 140px;
    }
    .human, .machine {
        min-width: 100%;
    }
    .human .io, .machine .io {
        height: 200px;
    }
}
</style>
</head>

<body>
<div class="calculator">
  <h2 class="calculator-heading">Kalkulator arytmetyczny</h2>
  <div class="choose">
    <p>Pierwsza liczba w systemie:</p>
    <form class="radio-group">
      <label>
        <input class="ip" id="bin" type="radio" name="input1" value="bin" checked>
        <span>Binarnym</span></label>
      <label>
        <input class="ip" id="oct" type="radio" name="input1" value="oct">
        <span>Ósemkowym</span> </label>
      <label>
        <input class="ip" id="dec" type="radio" name="input1" value="dec">
        <span>Dziesiętnym</span> </label>
      <label>
        <input class="ip" id="hex" type="radio" name="input1" value="hex">
        <span>Szesnastkowym</span> </label>
    </form>
    <p>Druga liczba w systemie:</p>
    <form class="radio-group">
      <label>
        <input class="ip" id="opbin" type="radio" name="input2" value="bin">
        <span>Binarnym</span> </label>
      <label>
        <input class="ip" id="opoct" type="radio" name="input2" value="oct">
        <span>Ósemkowym</span> </label>
      <label>
        <input class="ip" id="opdec" type="radio" name="input2" value="dec" checked>
        <span>Dziesiętnym</span> </label>
      <label>
        <input class="ip" id="ophex" type="radio" name="input2" value="hex">
        <span>Szesnastkowym</span> </label>
    </form>
    <p>Wynik w systemie:</p>
    <form class="radio-group">
      <label>
        <input class="ip" id="fbin" type="radio" name="input3" value="bin">
        <span>Binarnym</span> </label>
      <label>
        <input class="ip" id="foct" type="radio" name="input3" value="oct">
        <span>Ósemkowym</span> </label>
      <label>
        <input class="ip" id="fdec" type="radio" name="input3" value="dec" checked>
        <span>Dziesiętnym</span> </label>
      <label>
        <input class="ip" id="fhex" type="radio" name="input3" value="hex">
        <span>Szesnastkowym</span> </label>
    </form>
    <p>Operacja do wykonania:</p>
    <form class="radio-group">
      <label>
        <input class="ip" id="add" type="radio" name="operation" value="Add" checked>
        <span>Dodawanie</span> </label>
      <label>
        <input class="ip" id="sub" type="radio" name="operation" value="Subtract">
        <span>Odejmowanie</span> </label>
      <label>
        <input class="ip" id="mul" type="radio" name="operation" value="Multiply">
        <span>Mnożenie</span> </label>
      <label>
        <input class="ip" id="div" type="radio" name="operation" value="Divide">
        <span>Dzielenie</span> </label>
    </form>
  </div>
  <br />
  <form id="format">
    <input class="box input" id="box1" type="text" placeholder="Pierwsza liczba" />
    <br />
    <input class="box input" id="box2" type="text" placeholder="Druga liczba" />
  </form>
  <div class="button">
    <input type="button" class="clear" value="Wykonaj" onclick="process();" />
    <input type="button" class="clear" value="Wyczyść" onclick="clr();" />
  </div>
  <div class="ans"> Wynik = <span id="ans"></span> </div>
  <br />
  <h1 class="title">Konwerter Binarny, Decimal i Hex</h1>
  <div class="container">
    <div class="section">
      <div class="heading">
        <h2 style="text-align: center;">Binary</h2>
      </div>
      <input type="text" name="binary" id="binary" placeholder="Wprowadź liczbę binarną">
      <div class="btns">
        <button class="btn" id="bToD">Na Decimal</button>
        <button class="btn" id="bToH">Na Hex</button>
      </div>
      <span class="output selectable" id="bOutput"></span> </div>
    <div class="section">
      <div class="heading">
        <h2 style="text-align: center;">Decimal</h2>
      </div>
      <input type="text" name="decimal" id="decimal" placeholder="Wprowadź liczbę dziesiętną">
      <div class="btns">
        <button class="btn" id="dToB">Na Binary</button>
        <button class="btn" id="dToH">Na Hex</button>
      </div>
      <span class="output selectable" id="dOutput"></span> </div>
    <div class="section">
      <div class="heading">
        <h2 style="text-align: center;">Hexa-decimal</h2>
      </div>
      <input type="text" name="hexadecimal" id="hexadecimal" placeholder="Wprowadź liczbę szesnastkową">
      <div class="btns">
        <button class="btn" id="hToB">Na Binary</button>
        <button class="btn" id="hToD">Na Decimal</button>
      </div>
      <span class="output selectable" id="hOutput"></span> </div>
  </div>
</div>
<div class="wrapper">
  <div class="content">
    <p class="heading">Konwerter Tekstu (ASCII) na tekst Binarny</p>
    <div class="converter-container">
      <div class="human">
        <p class="heading-2">Wprowadź tekst</p>
        <div class="io" contenteditable="true"></div>
      </div>
      <div class="machine">
        <p class="heading-2">Wynik Binarny</p>
        <div class="io" contenteditable="true"></div>
      </div>
    </div>
  </div>
</div>

<script>
// Kod JavaScript 
var UI = {
    human : {
        io      : document.querySelector('.human .io'),
        figure  : document.querySelector('.human .face')
    },
    machine : {
        io      : document.querySelector('.machine .io'),
        figure  : document.querySelector('.machine .face')
    }
};

var App = {
    init : function () {
        this.bindEvents();
        UI.human.io.textContent = "www.skrip.pl"
        UI.machine.io.innerHTML = this.toBinary( UI.human.io.textContent );
    },

    bindEvents : function () {
        var _this = this;

        helpers.addEvent(UI.human.io, "keyup", function (ev) {
            UI.machine.io.innerHTML = _this.toBinary( UI.human.io.textContent );
        });

        helpers.addEvent(UI.machine.io, "keyup", function (ev) {
            UI.human.io.innerHTML = _this.toHuman( UI.machine.io.textContent );
        });
    },

    toBinary : function (text) {
        var _this   = this,
            length  = text.length,
            binary  = "";
        for (var i = 0; i < length; i += 1) {
            binary += _this.pad( (text.charCodeAt(i)).toString(2) ) + " ";
        }
        return binary;
    },

    toHuman : function (text) {
        var arr = text.trim().split(/\s+/ig),
            result = "";
        arr.forEach(function(a) {
            result += String.fromCharCode( parseInt( a, 2 ));
        });
        return result;
    },

    pad : function (number) {
        var eight = number;
        while (eight.length < 8) {
            eight = '0' + eight;
        }
        return eight;
    }
};

var helpers = {
    addEvent : function (obj, type, fn) {
        if (obj.addEventListener) {
            obj.addEventListener(type, fn, false);
        } else if (obj.attachEvent) {
            obj['e' + type + fn] = fn;
            obj[type + fn] = function() {
                obj['e' + type + fn](window.event);
            };
            obj.attachEvent("on" + type, obj[type + fn]);
        }
    },
    triggerEvent : function (el, type) {
        if ((el[type] || false) && typeof el[type] == 'function') {
            el[type](el);
        }
    }
};

App.init();

function process() {
    if (document.getElementById("bin").checked) {
        handle_bin()
    } else if (document.getElementById("dec").checked) {
        handle_dec()
    } else if (document.getElementById("hex").checked) {
        handle_hex()
    } else if (document.getElementById("oct").checked) {
        handle_oct()
    }
}

function handle_bin() {
    var x;
    x = converttodec(2, 1);
    if (document.getElementById("opdec").checked) {
        var y;
        y = converttodec(10, 2)
    } else if (document.getElementById("ophex").checked) {
        var y;
        y = converttodec(16, 2)
    } else if (document.getElementById("opoct").checked) {
        var y;
        y = converttodec(8, 2)
    } else if (document.getElementById("opbin").checked) {
        var y;
        y = converttodec(2, 2)
    }
    output(x, y)
}

function handle_dec() {
    var x;
    x = converttodec(10, 1);
    if (document.getElementById("opdec").checked) {
        var y;
        y = converttodec(10, 2)
    } else if (document.getElementById("ophex").checked) {
        var y;
        y = converttodec(16, 2)
    } else if (document.getElementById("opoct").checked) {
        var y;
        y = converttodec(8, 2)
    } else if (document.getElementById("opbin").checked) {
        var y;
        y = converttodec(2, 2)
    }
    output(x, y)
}

function handle_hex() {
    var x = converttodec(16, 1);
    if (document.getElementById("opdec").checked) {
        var y;
        y = converttodec(10, 2)
    } else if (document.getElementById("ophex").checked) {
        var y;
        y = converttodec(16, 2)
    } else if (document.getElementById("opoct").checked) {
        var y;
        y = converttodec(8, 2)
    } else if (document.getElementById("opbin").checked) {
        var y;
        y = converttodec(2, 2)
    }
    output(x, y)
}

function handle_oct() {
    var x;
    x = converttodec(8, 1);
    if (document.getElementById("opdec").checked) {
        var y;
        y = converttodec(10, 2)
    } else if (document.getElementById("ophex").checked) {
        var y;
        y = converttodec(16, 2)
    } else if (document.getElementById("opoct").checked) {
        var y;
        y = converttodec(8, 2)
    } else if (document.getElementById("opbin").checked) {
        var y;
        y = converttodec(2, 2)
    }
    output(x, y)
}

function converttobin(r, option) {
    if (option == 1) var no = document.getElementById("box1");
    else if (option == 2) var no = document.getElementById("box2");
    var y = parseInt(no.value, r);
    var z = y.toString(2);
    return z
}

function converttodec(r, option) {
    if (option == 1) var no = document.getElementById("box1");
    else if (option == 2) var no = document.getElementById("box2");
    var y = parseInt(no.value, r);
    var z = y.toString(10);
    return z
}

function converttohex(r, option) {
    if (option == 1) var no = document.getElementById("box1");
    else if (option == 2) var no = document.getElementById("box2");
    var y = parseInt(no.value, r);
    var z = y.toString(16);
    return z
}

function converttooct(r, option) {
    if (option == 1) var no = document.getElementById("box1");
    else if (option == 2) var no = document.getElementById("box2");
    var y = parseInt(no.value, r);
    var z = y.toString(8);
    return z
}

function output(x, y) {
    var a = parseInt(x);
    var b = parseInt(y);
    var z;
    if (document.getElementById("add").checked) z = a + b;
    else if (document.getElementById("sub").checked) z = a - b;
    else if (document.getElementById("mul").checked) z = a * b;
    else if (document.getElementById("div").checked) z = a / b;
    if (document.getElementById("fdec").checked) {
        var fans = document.getElementById("ans");
        fans.innerHTML = z
    } else if (document.getElementById("fhex").checked) {
        var ans = z.toString(16);
        var fans = document.getElementById("ans");
        fans.innerHTML = ans
    } else if (document.getElementById("foct").checked) {
        var ans = z.toString(8);
        var fans = document.getElementById("ans");
        fans.innerHTML = ans
    } else if (document.getElementById("fbin").checked) {
        var ans = z.toString(2);
        var fans = document.getElementById("ans");
        fans.innerHTML = ans
    }
}

function clr() {
    var fans = document.getElementById("ans");
    var b1 = document.getElementById("box1");
    var b2 = document.getElementById("box2");
    fans.innerHTML = "";
    b1.value = "";
    b2.value = ""
}

let binaryOutput = document.querySelector('#binary');
let decimalOutput = document.querySelector('#decimal');
let hexOutput = document.querySelector('#hexadecimal');

document.querySelector('#bToD').addEventListener('click', () => convertBit(binaryOutput.value, 'bOutput', 'binary', 'decimal'));
document.querySelector('#bToH').addEventListener('click', () => convertBit(binaryOutput.value, 'bOutput', 'binary', 'hex'));
document.querySelector('#dToB').addEventListener('click', () => convertBit(decimalOutput.value, 'dOutput', 'decimal', 'binary'));
document.querySelector('#dToH').addEventListener('click', () => convertBit(decimalOutput.value, 'dOutput', 'decimal', 'hex'));
document.querySelector('#hToB').addEventListener('click', () => convertBit(hexOutput.value, 'hOutput', 'hex', 'binary'));
document.querySelector('#hToD').addEventListener('click', () => convertBit(hexOutput.value, 'hOutput', 'hex', 'decimal'));

function convertBit(src, output, from, to) {
    switch (from) {
        case 'binary':
            document.getElementById(output).textContent = to === 'decimal' ? binToDec(src) : binToHex(src);
            break;
        case 'decimal':
            document.getElementById(output).textContent = to === 'binary' ? decToBin(src) : decToHex(src);
            break;
        case 'hex':
            document.getElementById(output).textContent = to === 'binary' ? hexToBin(src) : hexToDec(src);
            break;
    }
}

function binToDec(src) {
    let answer = 0;
    let n = 0;
    let srcString = src.toString();
    
    for (let i = srcString.length - 1; i >= 0; i--) {
        answer += srcString[i] * 2 ** n;
        n++;
    }

    return answer;
}

function binToHex(src) {
    const baseMap = {
        '0000': '0',
        '0001': '1',
        '0010': '2',
        '0011': '3',
        '0100': '4',
        '0101': '5',
        '0110': '6',
        '0111': '7',
        '1000': '8',
        '1001': '9',
        '1010': 'A',
        '1011': 'B',
        '1100': 'C',
        '1101': 'D',
        '1110': 'E',
        '1111': 'F'
    };

    let i;
    let answer = '';
    let rem = '';
    const len = 4;
    const srcString = src.toString();

    for (i = srcString.length; i >= len; i -= len) {
        if (i - len < srcString.length) {
            answer = baseMap[srcString.substr(i - len, len)] + answer;
        }
    }
    
    if (i !== 0) {
        rem = srcString.substr(0, i);
        while (rem.length < 4) {
            rem = '0' + rem;
        }
        answer = baseMap[rem] + answer;
    }

    return answer;
}

function decToBin(src) {
    let n = 0;
    let answer = '';

    while (2 ** (n) < src) n++;
    
    for (n; n >= 0; n--) {
        if (2 ** n <= src) {
            answer += '1';
            src = src % 2 ** n;
        } else {
            answer += answer === '' ? '' : '0';
        }
    }
    return answer;
}

function decToHex(src) {
    const baseMap = {
        '0': '0',
        '1': '1',
        '2': '2',
        '3': '3',
        '4': '4',
        '5': '5',
        '6': '6',
        '7': '7',
        '8': '8',
        '9': '9',
        '10': 'A',
        '11': 'B',
        '12': 'C',
        '13': 'D',
        '14': 'E',
        '15': 'F'
    };

    let n = 0;
    let answer = '';
    const base = 16;

    while (base ** (n + 1) < src) n++;

    for (n; n >= 0; n--) {
        if (base ** n <= src) {
            answer += baseMap[Math.floor(src / base ** n).toString()];
            src = src - Math.floor(src / base ** n) * (base ** n);
        } else {
            answer += '0';
        }
    }
    
    return answer;
}

function hexToBin(src) {
    const baseMap = {
        '0': '0000',
        '1': '0001',
        '2': '0010',
        '3': '0011',
        '4': '0100',
        '5': '0101',
        '6': '0110',
        '7': '0111',
        '8': '1000',
        '9': '1001',
        'A': '1010',
        'B': '1011',
        'C': '1100',
        'D': '1101',
        'E': '1110',
        'F': '1111'
    };

    let srcString = src.toString().toUpperCase();
    let answer = '';

    for (let i = 0; i < srcString.length; i++) {
        answer += baseMap[srcString[i]];
    }
    
    return answer;
}

function hexToDec(src) {
    const baseMap = {
        '0': '0',
        '1': '1',
        '2': '2',
        '3': '3',
        '4': '4',
        '5': '5',
        '6': '6',
        '7': '7',
        '8': '8',
        '9': '9',
        'A': '10',
        'B': '11',
        'C': '12',
        'D': '13',
        'E': '14',
        'F': '15'
    };

    let srcString = src.toString().toUpperCase();
    let answer = 0;

    for (let i = 0; i < srcString.length; i++) {
        answer += baseMap[srcString[i]] * (16 ** (srcString.length - 1 - i))
    }

    return answer;
}
</script>
</body>
</html>

Top Stories

Kalkulator równań kwadratowych

Przelicznik Walut online – oparte na notowaniach NBP

Gra w wojnę – prosta gra w karty

Kalkulator arytmetyczny międzysystemowy, konwerter systemów liczbowych oraz tekstu ASCII na Binarny

Prosty kalkulator do działań pomiędzy systemem dziesiętnym (Decimal), szesnastkowym (Hexa-decimal) i dwójkowym (Binary).

Zestaw narzędzi do konwersji

Kalkulator arytmetyczny międzysystemowy

Do czego służy?

Przykład użycia:

Kalkulator Arytmetyczny

System pierwszej liczby

System drugiej liczby

Operacja

Wynik w systemie

Konwerter Systemów Liczbowych

Do czego służy?

Przykład użycia:

Konwerter Systemów Liczbowych

System Binarny

System Dziesiętny

System Szesnastkowy

Konwerter Tekstu ASCII na Binarny

Do czego służy?

Przykład użycia:

Konwerter Tekstu ASCII na Binarny

Tekst ASCII

Kod Binarny

Główne funkcjonalności:

Wyjaśnienie systemów liczbowych:

Jak wstawić gadżet na własną stronę?

index.html

Gotowiec do pobrania

Chmurka tagów

Zaprzyjaźniona strona

Najczęściej oglądane wpisy

Top Stories

Kalkulator równań kwadratowych

Przelicznik Walut online – oparte na notowaniach NBP

Gra w wojnę – prosta gra w karty

Zestaw narzędzi do konwersji

Kalkulator arytmetyczny międzysystemowy

Do czego służy?

Przykład użycia:

Kalkulator Arytmetyczny

System pierwszej liczby

System drugiej liczby

Operacja

Wynik w systemie

Konwerter Systemów Liczbowych

Do czego służy?

Przykład użycia:

Konwerter Systemów Liczbowych

System Binarny

System Dziesiętny

System Szesnastkowy

Konwerter Tekstu ASCII na Binarny

Do czego służy?

Przykład użycia:

Konwerter Tekstu ASCII na Binarny

Tekst ASCII

Kod Binarny

Główne funkcjonalności:

Wyjaśnienie systemów liczbowych:

Jak wstawić gadżet na własną stronę?

index.html

Gotowiec do pobrania

Może Ci się spodobać:

Notatnik online

Generator oraz skaner kodów QR do wstawienia na własną stronę

Blob generator CSS online

Metronom online do wstawienia na własną stronę