RGB

RGB (skrót od Red, Green, Blue) to model kolorów oparty na mieszaniu trzech barw światła: czerwonej, zielonej i niebieskiej. Jest podstawowym modelem stosowanym w projektowaniu cyfrowym, wyświetlaczach komputerowych, telewizorach, a także aparatach i innych urządzeniach, które generują obraz za pomocą światła. Służy do definiowania kolorów na ekranie – w stronach internetowych, aplikacjach i materiałach cyfrowych.

Jak działa model RGB?

Model działa na zasadzie addytywnego mieszania barw – oznacza to, że kolory tworzy się poprzez dodawanie światła. Gdy wszystkie trzy kolory (R, G, B) mają wartość maksymalną (np. 255, 255, 255), uzyskujemy biały kolor. Gdy wszystkie są równe zeru (0, 0, 0) – mamy kolor czarny. Inne kolory powstają przez różne kombinacje wartości trzech składowych w zakresie od 0 do 255.

Przykłady:

  • Pomarańcz ognisty: (253, 82, 0)
  • Miodowy blask: (251, 167, 13)
  • Błękit lawendowy: (117, 120, 255)
Przykłady kolorów zapisanych w formacie RGB

Zastosowanie RGB w projektowaniu cyfrowym

  • Strony internetowe – kolory w CSS definiowane są m.in. w formacie RGB lub HEX (odpowiednik w zapisie szesnastkowym).
  • Aplikacje i interfejsy użytkownika (UI) – wszystkie kolory na ekranach są wyświetlane z użyciem omawianego modelu.
  • Grafika cyfrowa i multimedia – projektowanie np. grafik, animacji, prezentacji, materiałów wideo.
  • UI/UX design – RGB umożliwia precyzyjne dopasowanie kolorów do stylu marki, a także w celu zbudowania dostępności interfejsu.

RGB a inne modele kolorów

  • CMYK – używany w druku, oparty na mieszaniu barwników (cyan, magenta, yellow, black). Kolory RGB mogą wyglądać inaczej po konwersji do CMYK.
  • HEX – sześciocyfrowy zapis koloru w systemie szesnastkowym, stosowany m.in. w kodzie HTML/CSS (np. #FF0000 dla czerwieni).
  • HSL i HSV – alternatywne modele używane do bardziej intuicyjnego manipulowania kolorem poprzez parametry takie, jak: jasność, nasycenie, odcień.

Dobre praktyki przy pracy z RGB

  • Projektuj w RGB tylko dla ekranów – do druku lepiej korzystać z modelu CMYK.
  • Używaj kontrastu – dobieraj kolory z odpowiednią różnicą jasności, by zachować czytelność tekstu.
  • Testuj kolory na różnych urządzeniach – pamiętaj, że kalibracja ekranów może wpływać na odbiór barw.
  • Korzystaj z narzędzi wspierających dostępność cyfrową – np. sprawdzających kontrast kolorów w interfejsach (zgodność z WCAG).

Reguła 60-30-10

Reguła 60-30-10 to popularna zasada stosowana w projektowaniu graficznym. Określa proporcje kolorów używanych w kompozycji, aby stworzyć harmonijny, estetyczny i dobrze zbalansowany wygląd. Jest to sprawdzona metoda, która pomaga unikać chaosu wizualnego i wprowadza spójność do projektu.

Na czym polega reguła 60-30-10

Reguła wprowadza 3 główne kolory stosowane w projekcie, opisuje ich charakter oraz przypisuje role i przeznaczenie.

  • 60% – Kolor dominujący:
    • Stanowi główny kolor w projekcie, który dominuje i wyznacza ton całej kompozycji.
    • Powinien być neutralny lub na tyle uniwersalny, by dobrze współgrać z pozostałymi kolorami.
    • Może dominować na tle, dużych blokach tekstu lub elementach graficznych.
  • 30% – Kolor uzupełniający:
    • Kolor ten wspiera kolor dominujący, tworząc kontrast, ale jednocześnie zachowując harmonię.
    • Używany w mniejszym zakresie, np. w sekcjach tekstów i ikonach.
  • 10% – Kolor akcentowy:
    • Najbardziej wyrazisty kolor, który przyciąga uwagę i nadaje projektowi charakteru.
    • Używany w detalach, takich przykładowo przyciski CTA w projektach internetowych lub akcenty tekstowe.

Dlaczego warto stosować regułę

  • Zastosowanie tej reguły pozwala osiągnąć harmonię wizualną, uniknąć przesycenia i chaosu kolorystycznego. Elementy wizualne wydają się bardziej uporządkowane i estetyczne.
  • Reguła 60-30-10 jest prosta w zastosowaniu. W efekcie jest idealna zarówno dla profesjonalistów, jak i amatorów. Pomaga w szybkim tworzeniu zrównoważonych kompozycji.
  • Wyraźne proporcje kolorów ułatwiają wywołanie wrażenia spójności i wyrazistości. Skupienie uwagi na kluczowych elementach projektu, takich jak akcenty wizualne wzmacnia przekaz projektu.
  • Zasada jest uniwersalna działa w różnych dziedzinach, od projektowania wnętrz, przez grafikę komputerową, aż po projektowanie stron internetowych i branding.

Reguła 60-30-10 to prosta i skuteczna zasada, która pomaga w tworzeniu harmonijnych kompozycji kolorystycznych w różnych dziedzinach projektowania. Dzięki odpowiedniemu zastosowaniu proporcji można uzyskać estetyczne, spójne i atrakcyjne wizualnie projekty, które wyróżniają się na tle konkurencji, a także przyciągają uwagę odbiorców.