@inverz/thai-plate

ช่องกรอก เลขทะเบียนรถ พร้อมจังหวัดสำหรับ React เว้นวรรคให้ตอนพิมพ์ แปลงเลขไทยเป็นเลขอารบิก ตรวจรูปแบบตามประเภทรถ 13 ประเภท และแสดงหน้าตาป้ายทะเบียนตามสีจริงของแต่ละประเภท (ป้ายขาว ป้ายฟ้า ป้ายเขียว ป้ายเหลือง ป้ายรถโดยสาร) รายชื่อ 77 จังหวัดตรงกับข้อมูลกรมการปกครอง

ดูตัวอย่าง (Demo)

A React input for Thai licence plates: plate number and province with a live plate drawing, and format checks for 13 plate types: cars, vans, pickups, taxis, tuk-tuks, rental cars, motorcycles, buses, trucks and public vans.

ติดตั้ง

npm i @inverz/thai-plate

import "@inverz/thai-plate/style.css";
import { LicensePlateInput, LicensePlate } from "@inverz/thai-plate";

const [plate, setPlate] = useState({});

<LicensePlateInput value={plate} onChange={(value, info) => setPlate(value)} />

ค่าที่ได้:

value = { plate: "1กข 1234", provinceId: 10, type: "car" }
info  = { valid: true, plate: { prefix: "1", letters: "กข", number: "1234", text: "1กข 1234" },
          province: { id: 10, th: "กรุงเทพมหานคร", en: "Bangkok" }, error: null,
          formatted: "1กข 1234 กรุงเทพมหานคร" }

provinceId คือรหัสจังหวัดของกรมการปกครอง (ตรงกับ @inverz/thai-address)

ประเภทป้าย

ตามกฎกระทรวงกำหนดขนาด ลักษณะ และสีของแผ่นป้ายทะเบียนรถ พ.ศ. 2554 และประกาศกรมการขนส่งทางบก พ.ศ. 2565

| type | รถ | ประเภททะเบียน | สีป้าย | รูปแบบ | |---|---|---|---|---| | car | รถยนต์ส่วนบุคคล ไม่เกิน 7 คน | รย.1 | พื้นขาว ตัวอักษรดำ | 1กข 1234 | | van | รถตู้ / รถเกิน 7 คน (ป้ายฟ้า) | รย.2 | พื้นขาว ตัวอักษรน้ำเงิน | 1กข 1234 | | pickup | รถกระบะ / บรรทุกส่วนบุคคล (ป้ายเขียว) | รย.3 | พื้นขาว ตัวอักษรเขียว | 1กข 1234 | | tricycle | รถสามล้อส่วนบุคคล | รย.4 | พื้นขาว ตัวอักษรแดง | 1กข 1234 | | intercity | รถรับจ้างระหว่างจังหวัด | รย.5 | พื้นเหลือง ตัวอักษรแดง | 1กข 1234 | | taxi | แท็กซี่ | รย.6 | พื้นเหลือง ตัวอักษรดำ | 1กข 1234 | | small-hire | รถสี่ล้อเล็กรับจ้าง | รย.7 | พื้นเหลือง ตัวอักษรน้ำเงิน | 1กข 1234 | | tuktuk | รถสามล้อรับจ้าง (ตุ๊กตุ๊ก) | รย.8 | พื้นเหลือง ตัวอักษรเขียว | 1กข 1234 | | service | รถบริการธุรกิจ / ทัศนาจร / ให้เช่า | รย.9–11 | พื้นเขียว ตัวอักษรขาว | 1กข 1234 | | farm | รถแทรกเตอร์ / รถใช้งานเกษตร / รถพ่วง | รย.13–16 | พื้นส้ม ตัวอักษรดำ | 1กข 1234 | | moto | รถจักรยานยนต์ | รย.12 | พื้นขาว ตัวอักษรดำ | 3 บรรทัด 1กข / จังหวัด / 123 | | moto-taxi | รถจักรยานยนต์สาธารณะ | รย.17 | พื้นเหลือง ตัวอักษรดำ | 3 บรรทัด | | transport | รถโดยสาร รถบรรทุก รถตู้สาธารณะ (พ.ร.บ.การขนส่งทางบก) | | ตามเลขหน้าขีด | THAILAND / 10-1234 / จังหวัด |

"ป้ายเขียว" มีคนใช้เรียกทั้งป้ายพื้นขาวตัวอักษรเขียว (กระบะ pickup) และป้ายพื้นเขียวตัวอักษรขาว (รถบริการและรถเช่า service) ทั้งสองแบบมีให้เลือก

รูปแบบเลข

• car และประเภทที่ใช้แบบเดียวกัน: เลขนำหน้า 0–1 ตัว + ตัวอักษร 1–2 ตัว + เลข 1–4 หลัก
• moto, moto-taxi: ตัวอักษรได้ถึง 3 ตัว
• เลขทะเบียนต้องไม่ขึ้นต้นด้วย 0 ข้อความผิดพลาดของรูปแบบแสดงหลังออกจากช่อง

ป้ายรถโดยสารและรถบรรทุก (transport) เขียนเป็นเลข 2–3 หลัก ขีด เลข 4 หลัก สีป้ายเปลี่ยนตามเลขหน้าขีด:

| เลขหน้าขีด | รถ | สีป้าย | |---|---|---| | 10–19 | รถโดยสารประจำทาง | พื้นเหลือง ตัวอักษรดำ | | 20–29 | รถขนาดเล็ก | พื้นเหลือง ตัวอักษรดำ | | 30–35 | รถโดยสารไม่ประจำทาง | พื้นเหลือง ตัวอักษรดำ | | 36–39 | รถตู้โดยสารไม่ประจำทาง | พื้นขาว ตัวอักษรฟ้า | | 40–49 | รถโดยสารส่วนบุคคล | พื้นขาว ตัวอักษรดำ | | 50–59, 80–99 | รถบรรทุกส่วนบุคคล | พื้นขาว ตัวอักษรดำ | | 60–79 | รถบรรทุกไม่ประจำทาง | พื้นเหลือง ตัวอักษรดำ |

เลข 3 หลัก (100–999) ใช้เมื่อเลข 2 หลักหมดแล้ว และนับกลุ่มตามสองหลักแรก เช่น 365 เป็นรถตู้โดยสาร ป้ายจริงมีรหัสจังหวัดต่อท้ายคำว่า THAILAND แต่ยังหาตารางรหัสทางการไม่เจอ ภาพป้ายจึงแสดงแค่คำว่า THAILAND

ยังไม่รองรับ: ป้ายแดง (ป้ายชั่วคราวของผู้จำหน่าย) และป้ายทูต / องค์การระหว่างประเทศ ซึ่งมีรูปแบบต่างออกไป ป้ายประมูลที่มีสระหรือตัวอักษรเกิน 2 ตัว และป้ายกราฟิก จะไม่ผ่านการตรวจรูปแบบ

Props

| prop | ค่าเริ่มต้น | คำอธิบาย | |---|---|---| | value / defaultValue | | { plate, provinceId, type } | | onChange | | (value, info) => void | | types | ทั้ง 13 แบบ | ประเภทที่เลือกได้ เช่น types={["car", "van", "pickup"]} ใส่แบบเดียวจะซ่อนตัวเลือก ไม่เกิน 4 แบบแสดงเป็นปุ่มตัวเลือก มากกว่านั้นเป็น dropdown | | showPreview | true | แสดงภาพป้าย | | locale | "th" | "en" ป้ายกำกับภาษาอังกฤษ (ชื่อจังหวัดแสดงทั้งสองภาษา) | | required, disabled | false | | | name | | ส่งค่าในฟอร์มเป็น hidden input name[plate], name[provinceId], name[type] |

LicensePlate

แสดงป้ายอย่างเดียว province รับ object รหัสจังหวัด หรือชื่อไทย/อังกฤษ

<LicensePlate plate="1กข 1234" province="กรุงเทพมหานคร" />
<LicensePlate plate="ทก 5678" province={50} type="taxi" />
<LicensePlate plate="1กค 234" province="Khon Kaen" type="moto" />
<LicensePlate plate="1กข 4567" province="นนทบุรี" type="van" />
<LicensePlate plate="36-1234" province="นนทบุรี" type="transport" />

ขนาดปรับด้วย --tpl-plate-width ตัวอักษรบนป้ายปรับตามขนาดให้เอง

ใช้ฝั่ง server

@inverz/thai-plate/core ไม่ดึง React

import { parsePlate, formatPlate, plateError, findProvince, PROVINCES } from "@inverz/thai-plate/core";

formatPlate("๑กข๑๒๓๔");                 // "1กข 1234"
parsePlate("กขค 123");                   // null (3 ตัวอักษรใช้กับรถจักรยานยนต์)
parsePlate("กขค 123", { type: "moto" }); // { prefix: "", letters: "กขค", number: "123", text: "กขค 123" }
plateError("1กข 0123");                  // "zero"
findProvince("Chiang Mai");              // { id: 50, th: "เชียงใหม่", en: "Chiang Mai" }

formatPlate("361234", { type: "transport" });           // "36-1234"
parsePlate("36-1234", { type: "transport" }).group.kind; // "public-van"
plateColors("van");                                      // { bg: "#ffffff", ink: "#1546a8" }
PLATE_TYPE_INFO.pickup;  // { code: "รย.3", layout: "car", bg: "white", ink: "green", th: "รถกระบะ / …", en: "…" }

| ฟังก์ชัน | คำอธิบาย | |---|---| | PROVINCES, PROVINCES_SORTED | 77 จังหวัด (PROVINCES_SORTED กรุงเทพฯ ก่อน แล้วเรียงตามตัวอักษรไทย) | | findProvince(query) | หาจากรหัส ชื่อไทย ชื่ออังกฤษ หรือ "กทม" | | formatPlate(text, { type }) | จัดรูปแบบระหว่างพิมพ์ (ป้าย transport ใส่ขีดให้) | | parsePlate(text, { type }) | แยกส่วน หรือ null ถ้าไม่ถูกรูปแบบ | | isValidPlate(text, { type }) | ถูกรูปแบบไหม | | plateError(text, { type }) | "empty" / "zero" / "format" / null | | PLATE_TYPES, PLATE_TYPE_INFO | ประเภทป้ายทั้ง 13 แบบ พร้อมประเภททะเบียน รูปแบบ สีพื้น สีตัวอักษร ชื่อไทย/อังกฤษ | | plateColors(type, plate) | สีที่ใช้วาดป้าย { bg, ink } (ป้าย transport ดูจากเลขหน้าขีด) | | transportGroup(code) | กลุ่มของเลขหน้าขีด เช่น 36 → รถตู้โดยสาร, 71 → รถบรรทุกรับจ้าง | | PLATE_COLORS | ค่าสีที่ใช้ แก้ทับได้ถ้าอยากได้โทนอื่น |

ธีม

ปรับด้วย CSS variables --tpl-brand, --tpl-surface, --tpl-surface-muted, --tpl-border-strong, --tpl-text, --tpl-danger, --tpl-font, --tpl-plate-width, --tpl-plate-font

ตรวจเฉพาะรูปแบบ ไม่ได้ตรวจว่าทะเบียนมีอยู่จริง ป้ายเป็นภาพจำลองเพื่อแสดงผล ไม่ใช่แบบป้ายทางการ

License

MIT © 2026 Inverz Solutions Co.,Ltd.