Open Source · MIT License · Made for Taiwan

Forge

停止重寫
台灣驗證器

民國紀年、身分證、統編、健保卡、車牌、電話、地址 ——
21 個開源 React 元件，零依賴，157 筆測試，MIT 授權。

21 open-source React components for the Taiwan-localized form inputs every developer keeps rebuilding.

瀏覽元件庫完整表單範例

元件

校驗器

150+

單元測試

零

外部依賴

Try it now

貼上一組任何資料，即時驗證。

校驗碼、格式、區域代碼——全部在你的瀏覽器裡跑，沒有任何資料離開。

身分證 · TWID

✓ValidA123456789

Type:citizen

Region:臺北市

Install in your project

Spec source

內政部戶政司

Pure function. No network calls. The validator runs entirely in your browser — paste anything, nothing leaves your device.

為什麼需要本土化元件？

台灣數位服務有獨特需求，每個團隊都在重複造輪子。

消除重複開發

身分證驗證、郵遞區號、民國日期——這些邏輯不該每個專案重寫。

正確性保證

完整校驗邏輯：身分證 checksum、368 鄉鎮區郵遞區號、發票格式。

即裝即用

零外部依賴、TypeScript 型別完整、深色模式支援。

五大核心元件

每個元件都可直接互動 — 點擊試用

ROCDatePicker

民國日期選擇器

民國/西元雙曆顯示，支援日期範圍限制

民國紀年雙曆minDate/maxDate

TWIDInput

身分證字號驗證

即時 checksum 驗證，自動辨識國民身分證與居留證

校驗碼26 地區碼ARC 支援

臺北市國民身分證

TaiwanAddressInput

台灣地址輸入

三級聯動縣市鄉鎮區，自動帶入郵遞區號

22 縣市368 鄉鎮區自動郵遞區號

TaiwanPaymentButton

本土支付按鈕

LINE Pay / JKO Pay 品牌規範按鈕

LINE Pay街口支付3 尺寸

UniformInvoiceInput

統一發票輸入

自動格式化 XX-XXXXXXXX，即時格式驗證

自動連字號格式驗證

有效發票號碼

瀏覽全部 12 個元件

三步驟快速整合

安裝

npx taiwan-ui add twid-input

引入

import TWIDInput
  from '@/components/taiwan/TWIDInput'

使用

<TWIDInput
  value={id}
  onChange={setId} />

無障礙 · 合規 · 標準

Accessibility, Compliance & Standards

♿

WCAG 2.1 AA

鍵盤導航、螢幕閱讀器支援、高對比度

🔒

資料安全

純前端驗證，不傳送任何個資至外部伺服器

📱

響應式設計

375px 起完整支援，適用行動裝置

🌐

國際化就緒

中英雙語介面，可擴展多語系

發展藍圖

Roadmap — 持續擴充台灣數位服務所需的核心元件

eGUI 電子發票 API 串接

規劃中

自然人憑證整合

評估中

Taiwan FidO 身分驗證

評估中

金融卡 / 信用卡格式 (六大行庫)

規劃中

GOVT_READINESS 1.0 自評再審

規劃中

開始使用台灣 UI 元件庫

查看互動式元件文件，或瀏覽完整的政府表單範例

瀏覽元件庫 →表單範例 →

停止重寫台灣驗證器