Skip to content
BranchesTags

Latest commit

History

1 Commit

Folders and files

NameName
Last commit message
Last commit date
README.md
README.md

Repository files navigation

Web Dev Resources Thailand 🇹🇭

รวม resources สำหรับ Web Developer ไทย — ฟอนต์, สี, ไอคอน, เครื่องมือฟรี, แหล่งเรียนรู้ และ SEO guides ทั้งหมดในที่เดียว

AwesomeLicense: MITPRs Welcome

สารบัญ

🔤 ฟอนต์ภาษาไทย

Google Fonts (ฟรี, ใช้เชิงพาณิชย์ได้)

ฟอนต์สไตล์เหมาะกับ
Noto Sans ThaiNeutral, มาตรฐานBody text ทุกประเภท
IBM Plex Sans ThaiProfessionalCorporate, Fintech
Sarabunอ่านง่ายราชการ, Document
PromptทันสมัยStartup, App
Kanitหนา, โดดเด่นHeading, Banner
Mitrมน, Friendlyเด็ก, ครอบครัว
PridiSerif ไทยLuxury, Legal
Chakra PetchTechnoAuto, Sport, Gaming
Bai JamjureeGeometricTech, Modern
K2DFuturisticGaming, Sci-fi

SIPA / f0nt.com

ฟอนต์แหล่งเหมาะกับ
TH Sarabun NewSIPAมาตรฐานราชการ
TH Niramit ASSIPAFormal document
TH Charm of AUSIPACalligraphy

📖 อ่านเพิ่ม: 25 ฟอนต์ไทยฟรี 2026 | เลือกฟอนต์เว็บไซต์ไทย

🎨 Color Palette

เครื่องมือสร้างสี

เครื่องมือคำอธิบาย
Coolorsสุ่ม palette กด spacebar
Realtime Colorsดู preview บนเว็บจริง
Adobe ColorColor wheel + harmony rules
Tailwind CSS Colorsสีจาก Tailwind
Open Colorสี 13 โทน สำหรับ UI

Palette แนะนำตามอุตสาหกรรม

อุตสาหกรรมPalette
CorporateNavy #1e3a5f + Gold #d4a843 + Light Gray #f5f5f5
คลินิก/สุขภาพTeal #0d9488 + White #ffffff + Warm Gray #f5f0eb
ร้านอาหารRed #dc2626 + Cream #fef3c7 + Dark #1c1917
Tech/StartupCyan #06b6d4 + Dark #0a0a0a + White #ffffff
LuxuryBlack #000000 + Gold #c8a960 + Cream #f9f6f1

📖 อ่านเพิ่ม: 20 Color Palette สวยๆ 2026

🎯 ไอคอน

Libraryสไตล์จำนวน
HeroiconsOutline/Solid, by Tailwind300+
Phosphor Icons6 weights9,000+
LucideFork จาก Feather1,500+
Tabler IconsStroke-based5,000+
Radix Iconsสำหรับ UI300+
Simple IconsBrand/Logo3,000+

📸 รูปภาพฟรี

แหล่งLicenseคุณภาพ
UnsplashFree, commercial OKสูงมาก
PexelsFree, commercial OKสูง
PixabayFree, commercial OKปานกลาง-สูง
unDrawSVG illustrationsสูง (illustration)
StorysetAnimated illustrationsสูง

🛠️ Design Tools

เครื่องมือใช้ทำอะไรราคา
FigmaUI/UX Design, PrototypeFree (3 projects)
CanvaGraphics, Social mediaFree + Pro
ExcalidrawWireframe, DiagramFree
Shots.soMockup screenshotsFree
SquooshImage compressionFree

💻 Development Frameworks

Frameworkภาษาเหมาะกับ
Next.jsReact/TypeScriptเว็บไซต์ + Web App (แนะนำ)
NuxtVueเว็บ Vue
SvelteKitSvelteเว็บเร็วมาก
AstroMulti-frameworkBlog, Content site
RemixReactWeb App

UI Libraries

Libraryใช้กับ
shadcn/uiNext.js/React + Tailwind
Radix UIReact primitives
Headless UITailwind + React/Vue

📖 อ่านเพิ่ม: Next.js vs WordPress | เทรนด์เว็บดีไซน์ 2026

☁️ Hosting (ฟรี)

Platformฟรี Tierเหมาะกับ
Vercel100GB bandwidthNext.js (แนะนำ)
Netlify100GB bandwidthStatic, JAMstack
Cloudflare PagesUnlimited bandwidthStatic + Edge
GitHub PagesStatic onlyDocumentation
Railway$5 credit/monthBackend, Database

🔍 SEO Tools

เครื่องมือใช้ทำอะไรราคา
Google Search ConsoleIndexing, Keywordsฟรี
Google Analytics 4Traffic, Behaviorฟรี
PageSpeed InsightsCore Web Vitalsฟรี
LighthousePerformance Auditฟรี
Rich Results TestSchema Validationฟรี
Ahrefs WebmasterBacklinks, Keywordsฟรี (limited)
Screaming FrogSite Crawlฟรี (500 URLs)

📖 อ่านเพิ่ม: SEO Checklist สำหรับเว็บไซต์ไทย

⚡ Automation

เครื่องมือราคาจุดเด่น
n8nฟรี (self-hosted)Open source, PDPA-safe
MakeFree (1,000 ops)1,000+ apps, visual
ZapierFree (100 tasks)5,000+ apps, ง่ายที่สุด

📖 อ่านเพิ่ม: n8n Thai Templates | n8n vs Make vs Zapier

🤖 AI Tools

เครื่องมือใช้ทำอะไร
ClaudeCoding assistant, content
ChatGPTGeneral AI, code review
v0AI → React/Next.js UI
CursorAI-powered code editor
Vercel AI SDKBuild AI features in apps

📖 อ่านเพิ่ม: Agentic AI คืออะไร

📚 แหล่งเรียนรู้ภาษาไทย

แหล่งเนื้อหา
BorntoDevProgramming courses ไทย
SkooldioTech courses + certificate
CherCode BlogWeb dev, AI, Automation
Thai Programmerชุมชน developer ไทย

📝 บทความแนะนำ

Web Development

Typography & Design

AI & Automation

SEO

Contributing

อยากเพิ่ม resource? ยินดีรับ PR!

  • เพิ่มเครื่องมือ/ลิงก์ที่เป็นประโยชน์สำหรับ developer ไทย
  • แก้ลิงก์เสียหรือข้อมูลล้าสมัย

Author

Cher — Full-Stack Developer & Founder of CherCode

รับทำเว็บไซต์ AI และ Automation สำหรับธุรกิจไทย

License

MIT License

Curated with ❤️ by CherCode

About

รวม resources สำหรับ Web Developer ไทย — ฟอนต์, สี, ไอคอน, เครื่องมือฟรี, แหล่งเรียนรู้ SEO guides

chercode.com

Topics

awesomedesigndeveloper-toolsfree-resourcesresourcesseothaithai-developerthai-fontsweb-development

Resources

Readme
Activity
Custom properties

Stars

0 stars

Watchers

0 watching

Forks

1 fork
Report repository

Releases

Packages

Contributors