แบรนด์และ CI ของ Betagro
ชุดสี ฟอนต์ และโทเคนของแบรนด์ Betagro สำหรับเอาไปทำ presentation และ dashboard ให้ตรงแบรนด์ — ก๊อปค่าสี ธีม Power BI หรือชุดสี PowerPoint ไปใช้ได้เลย.
ข้อควรระวังเรื่องสีเขียว
สีเขียวแบรนด์ #84BD00 สว่างมาก — ใช้เป็น พื้น/ไอคอน/แท่งกราฟ ได้ แต่ถ้าเอาไปเป็น ตัวอักษรบนพื้นขาว จะอ่านยาก (ไม่ผ่าน WCAG). กรณีนั้นให้ใช้เขียวเข้ม #5E8A00 แทน.
สีแบรนด์ (Brand Colors)
แตะปุ่มคัดลอกเพื่อก๊อป HEX ไปใช้.
Betagro Green (CI / ดิจิทัล)
ไม่ใช้เป็นตัวอักษร#84BD00RGB 132, 189, 0 · HSL 78° 100% 37%
สีแบรนด์หลัก — ลิงก์ ปุ่ม ไฮไลต์ กราฟแท่งเด่น (ใช้เป็นพื้น/ไอคอน ไม่ใช้เป็นตัวอักษรบนพื้นขาว)
Deep Green (เขียวสำหรับตัวอักษร)
#5E8A00RGB 94, 138, 0 · HSL 82° 100% 27%
ใช้เมื่อต้องการ ตัวอักษร/ลิงก์ สีเขียวบนพื้นขาว — ผ่าน WCAG AA
Betagro Logo Green
ไม่ใช้เป็นตัวอักษร#7DB041RGB 125, 176, 65 · HSL 92° 46% 47%
เขียวของโลโก้ใบโคลเวอร์ — ใช้ตอนต้องตรงกับโลโก้/งานพิมพ์
Betagro Gold
#7C6E2CRGB 124, 110, 44 · HSL 49° 48% 33%
ทองของ wordmark 'BETAGRO' — สีรอง/พรีเมียม
Ink (หัวข้อ/ตัวเข้ม)
#212529RGB 33, 37, 41 · HSL 210° 11% 15%
หัวเรื่อง ตัวอักษรเข้ม
Body Gray
#76777BRGB 118, 119, 123 · HSL 228° 2% 47%
เนื้อความทั่วไป คำบรรยาย
Light Surface
ไม่ใช้เป็นตัวอักษร#F4F6F8RGB 244, 246, 248 · HSL 210° 17% 96%
พื้นหลังการ์ด/แผงอ่อน
White
ไม่ใช้เป็นตัวอักษร#FFFFFFRGB 255, 255, 255 · HSL 0° 0% 100%
พื้นหลังหน้า
ฟอนต์ (Typography)
DB Helvethaica X
ฟอนต์องค์กรของ Betagro — ใช้ทั้งหัวเรื่องและเนื้อความ รองรับไทย+อังกฤษในตัวเดียว (น้ำหนัก Regular / Medium / Bold / Black). เป็นฟอนต์มีลิขสิทธิ์ (DB Fonts) ใช้ได้เมื่อเครื่ององค์กรติดตั้งไว้.
Noto Sans Thai
ฟอนต์ฟรีบน Google Fonts ที่ใกล้เคียงที่สุด (ไทย+อังกฤษ neutral grotesque) — ใช้แทนเมื่อเครื่องไม่มี DB Helvethaica X.
font-family: "DB Helvethaica X", "Noto Sans Thai", "Helvetica Neue", Arial, sans-serif;โลโก้ (Logo)
โลโก้ Betagro = ใบโคลเวอร์สามใบ (สื่อการเติบโต/เกษตร) สีเขียว #7DB041 เหนือ คำว่า BETAGRO ตัวหนาสีทอง #7C6E2C. เว้นพื้นที่ว่างรอบโลโก้ อย่างน้อยเท่าความสูงของใบโคลเวอร์ 1 ใบ และอย่าวางบนภาพรก.
Design Tokens (CSS / Tailwind)
โทเคน HSL สำหรับงานเว็บที่อยากใช้ธีม Betagro.
/* Betagro light theme — semantic tokens (HSL, สำหรับ Tailwind / shadcn) */
--background: 0 0% 100%; /* #FFFFFF */
--foreground: 210 11% 15%; /* #212529 ink */
--muted: 210 17% 96%; /* #F4F6F8 */
--muted-foreground: 228 2% 47%; /* #76777B */
--primary: 78 100% 37%; /* #84BD00 Betagro Green (พื้น/ไอคอน) */
--primary-strong: 82 100% 27%; /* #5E8A00 เขียวสำหรับตัวอักษร (WCAG AA) */
--accent: 49 48% 33%; /* #7C6E2C Betagro Gold */
--border: 210 14% 89%; /* #DEE2E6 */
--ring: 78 100% 37%;
--success: 92 46% 47%; /* #7DB041 */
--warning: 45 93% 47%;
--danger: 4 74% 49%;ธีม Power BI
ก๊อป JSON นี้ → ใน Power BI ไปที่ View → Themes → Browse for themes แล้วเซฟเป็นไฟล์ .json มาเลือก. กราฟจะใช้สีแบรนด์อัตโนมัติ.
{
"name": "Betagro Corporate",
"dataColors": [
"#84BD00", "#7C6E2C", "#7DB041", "#5E8A00",
"#A8D44A", "#C2B36A", "#212529", "#76777B"
],
"background": "#FFFFFF",
"foreground": "#212529",
"tableAccent": "#84BD00",
"good": "#7DB041",
"neutral": "#C2B36A",
"bad": "#D9342B",
"maximum": "#5E8A00",
"minimum": "#EAF4D6"
}ชุดสี PowerPoint
ใน PowerPoint ไปที่ Design → Variants → Colors → Customize Colors แล้วใส่ค่าตามนี้.
Accent 1 — Betagro Green
#84BD00Accent 2 — Betagro Gold
#7C6E2CAccent 3 — Logo Green
#7DB041Accent 4 — Deep Green (ตัวอักษร)
#5E8A00Accent 5 — Web Gold
#89813DAccent 6 — Light Green (tint)
#A8D44AText/Dark 1
#212529Text/Dark 2
#76777BBackground 2
#F4F6F8Background 1
#FFFFFFค่าทั้งหมดแกะมาจาก betagro.com (DOM + ไฟล์โลโก้จริง) วันที่ 2026-06-10. ค่าหลัก (เขียว #84BD00, ทอง, ฟอนต์ DB Helvethaica X) ยืนยันจากเว็บจริง. ส่วนเฉดอ่อน/เข้มที่ derive เพิ่ม (#5E8A00, #A8D44A ฯลฯ) และอัตราเว้นพื้นที่โลโก้ เป็นคำแนะนำ — ควรเทียบกับ Brand Book ทางการของ Betagro อีกครั้ง.