Systemy liczbowe — język komputera (binarny, szesnastkowy, kolory RGB)

Po co się tego uczymy?

Ty liczysz w systemie dziesiętnym, bo masz 10 palców — komputer ma tylko "prąd płynie / nie płynie", więc liczy binarnie. Zrozumienie przeliczania między systemami liczbowymi (i praktycznego zastosowania — kolorów w CSS!) to jedno z częściej sprawdzanych zagadnień w pisemnej części matury z informatyki.

Teoria

System liczbowy to sposób reprezentowania liczb za pomocą cyfr — każdy ma BAZĘ (ile cyfr dostępnych) i POZYCJĘ (każda cyfra ma znaczenie zależne od miejsca). Kluczowa idea: KAŻDA POZYCJA TO POTĘGA BAZY. W systemie dziesiętnym liczba 2024 to 2×10³ + 0×10² + 2×10¹ + 4×10⁰.

System binarny (baza 2) — tylko cyfry 0 i 1. Konwersja binarnej na dziesiętną: liczba 1011 to 1×2³ + 0×2² + 1×2¹ + 1×2⁰ = 8+0+2+1 = 11. Konwersja odwrotna (dziesiętna na binarną) — dzielimy przez 2, aż dojdziemy do 0, zbierając RESZTY od DOŁU do GÓRY: 25 ÷ 2 = 12 r.1, 12 ÷ 2 = 6 r.0, 6 ÷ 2 = 3 r.0, 3 ÷ 2 = 1 r.1, 1 ÷ 2 = 0 r.1 → wynik 11001.

Bajty i jednostki pochodne: 1 bajt = 8 bitów (zakres 0-255), 16 bitów = "słowo" (0-65535), 32 bity = "słowo podwójne" (do ~4,3 miliarda), 64 bity = "słowo czwórkowe".

System szesnastkowy/heksadecymalny (baza 16) — cyfry 0-9 oraz litery A-F (gdzie A=10, ..., F=15). Konwersja hex na dziesiętną: 2F4 = 2×16² + F×16¹ + 4×16⁰ = 512+240+4 = 756. Konwersja odwrotna — dzielimy przez 16, zbierając reszty (podobnie jak dla systemu binarnego).

Sztuczka: binarny ↔ szesnastkowy BEZ kalkulatora! Ponieważ 1 cyfra hex = DOKŁADNIE 4 bity, można konwertować grupując bity po 4: 1010 1111 0100 (binarnie) → A F 4 (hex), bo 1010=10=A, 1111=15=F, 0100=4. To dlatego programiści UWIELBIAJĄ system szesnastkowy — jest krótszy niż binarny, a przeliczenie jest natychmiastowe.

Praktyka: kolory RGB w heksadecymalnym (CSS) — każdy kolor to kombinacja trzech składników: R (Red), G (Green), B (Blue), każdy 0-255. W CSS/HTML zapisujemy je jako #RRGGBB (dwie cyfry hex na każdy kolor). Przykłady: #FF0000 = czerwony (R=255, G=0, B=0), #00FF00 = zielony, #FFFFFF = biały, #000000 = czarny. Konwersja RGB→HEX: każdą liczbę dziesiętną (0-255) zamieniamy osobno na dwucyfrowy hex, np. RGB(200,100,50) → #C86432.

ASCII i Unicode — każdy znak w komputerze to LICZBA. ASCII (128 znaków: litery, cyfry, podstawowe symbole) — np. "A" = 65 (dziesiętnie) = 41 (hex) = 01000001 (binarnie). Unicode/UTF-8 rozszerza to na PONAD 140 000 znaków — obejmuje wszystkie języki świata, symbole (€), a nawet emoji (🌍). Python obsługuje Unicode automatycznie — każdy string to ciąg znaków Unicode, niezależnie od języka.

Schemat

BINARNA -> HEX (grupami po 4 bity, BEZ kalkulatora):
Binarna:      1010  1111  0100
Heksadecym.:    A     F     4
(bo 1010=10=A, 1111=15=F, 0100=4)

KOLORY RGB -> HEX:
RGB(200, 100, 50)
  R: 200 ÷ 16 = 12 r.8  → C8 (hex)
  G: 100 ÷ 16 = 6  r.4  → 64 (hex)
  B: 50  ÷ 16 = 3  r.2  → 32 (hex)
Wynik: #C86432

ASCII:
A: 65 (DEC) = 41 (HEX) = 01000001 (BIN)
Tekst "AB" w pamięci = 01000001 01000010 (2 bajty)

Przykład z życia

Kiedy w edytorze CSS wpisujesz kolor tła strony jako #3498DB, tak naprawdę definiujesz trzy liczby (R=0x34=52, G=0x98=152, B=0xDB=219) w systemie szesnastkowym — dokładnie ta sama konwersja, którą poznajesz w tej lekcji, dzieje się za każdym razem, gdy projektujesz stronę internetową czy grafikę.

konwersje_liczbowe.py

# Konwersja RGB (dziesiętne) -> HEX (szesnastkowe) - kolory w CSS
def rgb_to_hex(r, g, b):
    return f"#{r:02X}{g:02X}{b:02X}"

kolor = rgb_to_hex(200, 100, 50)
print(kolor)  # #C86432


# Konwersja HEX -> RGB (dziesiętne)
def hex_to_rgb(hex_kolor):
    hex_kolor = hex_kolor.lstrip('#')
    return tuple(int(hex_kolor[i:i+2], 16) for i in (0, 2, 4))

rgb = hex_to_rgb('#C86432')
print(rgb)  # (200, 100, 50)


# ASCII/Unicode - każdy znak to liczba
print(ord('A'))    # 65
print(hex(ord('A')))  # 0x41
print(bin(ord('A')))  # 0b1000001

Komentarz i wyjaśnienie kodu

f"#{r:02X}{g:02X}{b:02X}" to formatowanie liczby jako DWUCYFROWEJ liczby szesnastkowej WIELKIMI literami (02X = minimum 2 cyfry, uzupełnione zerem z lewej, format heksadecymalny wielkimi literami) — dokładnie taki format, jakiego oczekuje CSS dla kolorów.

hex_kolor[i:i+2] for i in (0, 2, 4) dzieli napis "C86432" na trzy DWUZNAKOWE fragmenty ("C8", "64", "32") — po jednym na każdy kolor R, G, B — a int(..., 16) zamienia każdy fragment z zapisu szesnastkowego na zwykłą liczbę dziesiętną.

Ćwiczenie samodzielne

Uruchom rgb_to_hex() i hex_to_rgb() dla kilku różnych kolorów i sprawdź, że konwersja "w tę i z powrotem" daje ten sam wynik. Znajdź w internecie (albo wymyśl) 3 ulubione kolory i zapisz je w obu formatach.

Zadania do pracy własnej

Zamień liczbę 110101 (binarnie) na dziesiętną (ręcznie, metodą z tej lekcji, a potem zweryfikuj funkcją int("110101", 2) w Pythonie).
Zamień liczbę 255 (dziesiętnie) na binarnie i szesnastkowo — ręcznie, a potem zweryfikuj wynik funkcjami bin() i hex(). Sprawdź, jak wygląda kolor o zapisie #00FFFF w RGB.
Napisz w Pythonie funkcję, która dla dowolnego wpisanego tekstu wypisze kod binarny każdego znaku (użyj ord() i bin()). Dodatkowo: zapisz literę "Ł" w postaci kodu Unicode (ord()) i w systemie szesnastkowym (hex()).

Typowe błędy

Mylenie kolejności reszt przy ręcznej konwersji dziesiętny→binarny/hex — reszty trzeba odczytać OD OSTATNIEJ DO PIERWSZEJ (od dołu wzwyż), nie w kolejności, w jakiej zostały policzone.

Zapominanie, że 1 cyfra hex = DOKŁADNIE 4 bity — przy konwersji binarny↔hex trzeba grupować bity WŁAŚNIE po 4, licząc od PRAWEJ strony liczby.

Pomijanie zer wiodących przy zapisie kolorów RGB→HEX — np. R=8 to 08 w hex (dwucyfrowo), NIE samo 8 — format #RRGGBB wymaga zawsze DOKŁADNIE dwóch cyfr na każdy składnik.

Nawiązanie do egzaminu zawodowego

Systemy liczbowe to jeden z najczęściej sprawdzanych tematów w pisemnej części matury z informatyki oraz w podstawie programowej INF.04.2.5. W kolejnej, ostatniej lekcji tego działu poznasz sieci komputerowe — kolejny obszar teorii, w którym systemy liczbowe (adresy IP!) odgrywają kluczową rolę.