Thuta Learning
ရှာဖွေရန်
BasicWeb Developmentbeginner

Colors

စိတ်လျှော့ပါ။ ဒီခန်းကို စာအုပ်လိုမဟုတ်ဘဲ စကားပြောသလိုပဲ၊ နားလည်လွယ်အောင် ရှင်းပါမယ်။

ဒီခန်းပြီးရင် ဘာတတ်သွားမလဲ

  • CSS color format များကိုသုံးတတ်ရန်

CSS မှာ အရောင်သတ်မှတ်နည်းအမျိုးမျိုးရှိပါတယ်။ Color name က ဖတ်ရလွယ်တယ်။ HEX က design system တွေမှာအသုံးများတယ်။ RGB/RGBA က opacity ပါထိန်းချင်တဲ့အခါအဆင်ပြေပါတယ်။ Modern CSS မှာ hsl() လည်းအသုံးများလာပြီး hue, saturation, lightness နဲ့အရောင်ကိုနားလည်လွယ်အောင်ထိန်းနိုင်ပါတယ်။

css
.hero-title {
  color: tomato;
}

.card {
  /* black background with 70% opacity */
  background-color: rgba(0, 0, 0, 0.7);
  color: #ffffff;
  border: 1px solid hsl(190, 90%, 60%);
}
You should see
Title က tomato color ဖြစ်မယ်။ Card နောက်ခံက ဖောက်မြင်နိုင်တဲ့အနက်ရောင်ဖြစ်ပြီး စာသားအဖြူ၊ border က cyan လိုအရောင်ဖြစ်ပါမယ်။

Tip

Brand website တွေမှာ color တွေကို CSS variables နဲ့သိမ်းထားရင် နောက်ပိုင်း brand color ပြောင်းတဲ့အခါ တစ်နေရာတည်းပြင်ရုံပါပဲ။

Colors | Thuta Learning