---
title: CSS HEX Өнгө
description: "> RH (улаан), GG (ногоон) ба BB (цэнхэр) арван зургаатын бүхэл тоонууд нь өнгөний бүрэлдэхүүн хэсгүүдийг зааж өгсөн # 16RGBGBB-ээр арван зургаатын өнгийг зааж өгсөн болно. ## HEX утга CSS-д дараахь арван зургаатын утгыг ашиглан өнгө зааж өгч болно. #*rrggbb*…"
url: "https://apprentice.mn/docs/css-hex-colors/"
updated: "2021-07-23"
category: CSS
---

# CSS HEX Өнгө

> RH (улаан), GG (ногоон) ба BB (цэнхэр) арван зургаатын бүхэл тоонууд нь өнгөний бүрэлдэхүүн хэсгүүдийг зааж өгсөн # 16RGBGBB-ээр арван зургаатын өнгийг зааж өгсөн болно.

## HEX утга

CSS-д дараахь арван зургаатын утгыг ашиглан өнгө зааж өгч болно.

#*rrggbb*

Rr (улаан), gg (ногоон) ба bb (цэнхэр) нь 00 ба ff (0-255 аравтын адил) хоорондох арван зургаатын утга юм.

Жишээлбэл, # ff0000 нь улаанаар харагдана, яагаад гэвэл улаан нь хамгийн их утгад (ff), бусад нь хамгийн бага утгад (00) тохируулагдсан байдаг.

#ff6347

RED

 ff

GREEN

 63

BLUE

 47

 

# #ff0000

# #0000ff

# #3cb371

# #ee82ee

# #ffa500

# #6a5acd

HTML дээр та Hex утгыг ашиглан өнгө зааж өгч болно.

 

Саарал өнгийн сүүдэрийг бүх 3 гэрлийн эх үүсвэрүүдэд ижил утгыг өгч тодорхойлдог.

 

# #000000

# #3c3c3c

# #787878

# #b4b4b4

# #f0f0f0

# #ffffff

Улаан, ногоон, цэнхэр өнгийн ижил утгыг ашигласнаар та янз бүрийн саарал сүүдэртэй болно.

 

## 3 оронтой HEX утга

Заримдаа та CSS эх сурвалжинд 3 оронтой Hex өнгөний кодыг харах болно.

3 оронтой Hex код нь 6 оронтой зарим Hex кодын товчлол юм.

3 оронтой Hex код нь дараахь хэлбэртэй байна.

#*rgb*

Hex

Гурван оронтой Hex кодыг бүрэлдэхүүн хэсэг бүрийн утга (RR, GG, BB) хоёулаа ижил байх үед л ашиглаж болно. Тиймээс, хэрэв бидэнд # ff00cc байвал дараах байдлаар бичиж болно: # f0c.

### Жишээлбэл

     `body {
  background-color: #fc9; /* same as #ffcc99 */
}

h1 {
  color: #f0f; /* same as #ff00ff */
}

p {
  color: #b58; /* same as #bb5588 */
}`        [https://www.addtoany.com/add_to/facebook?linkurl=https%3A%2F%2Fapprentice.mn%2Fdocs%2Fcss-hex-colors%2F&linkname=CSS%20HEX%20%D3%A8%D0%BD%D0%B3%D3%A9](https://www.addtoany.com/add_to/facebook?linkurl=https%3A%2F%2Fapprentice.mn%2Fdocs%2Fcss-hex-colors%2F&linkname=CSS%20HEX%20%D3%A8%D0%BD%D0%B3%D3%A9)[https://www.addtoany.com/add_to/mastodon?linkurl=https%3A%2F%2Fapprentice.mn%2Fdocs%2Fcss-hex-colors%2F&linkname=CSS%20HEX%20%D3%A8%D0%BD%D0%B3%D3%A9](https://www.addtoany.com/add_to/mastodon?linkurl=https%3A%2F%2Fapprentice.mn%2Fdocs%2Fcss-hex-colors%2F&linkname=CSS%20HEX%20%D3%A8%D0%BD%D0%B3%D3%A9)[https://www.addtoany.com/add_to/email?linkurl=https%3A%2F%2Fapprentice.mn%2Fdocs%2Fcss-hex-colors%2F&linkname=CSS%20HEX%20%D3%A8%D0%BD%D0%B3%D3%A9](https://www.addtoany.com/add_to/email?linkurl=https%3A%2F%2Fapprentice.mn%2Fdocs%2Fcss-hex-colors%2F&linkname=CSS%20HEX%20%D3%A8%D0%BD%D0%B3%D3%A9)[https://www.addtoany.com/share](https://www.addtoany.com/share)