Article text (18px on desktop): This paragraph demonstrates the article body style used in blog posts and content pages. It features a larger font size and more generous line height (1.75) for comfortable long-form reading.
SurgeryPlanet Design System
Medical tourism platform — trustworthy, clean, modern, conversion-focused. Built with Tailwind CSS, Alpine.js, and Astro.
🎨 Color Palette
Primary — Medical Blue
50
100
200
300
400
500
600
700
800
900
950
Secondary — Cyan
50
100
200
300
400
500
600
700
800
Accent — Trust Green
50
100
200
300
400
500
600
700
800
Warning — Amber
Danger — Red
Surface — Gray
🔤 Typography
Headings — Plus Jakarta Sans
Heading 1 — The quick brown fox
Heading 2 — The quick brown fox
Heading 3 — The quick brown fox
Heading 4 — The quick brown fox
Heading 5 — The quick brown fox
Heading 6 — The quick brown fox
Body — Inter (16px / 18px article)
Body text (16px): Connecting patients with the world's best hospitals and surgeons across 50+ countries. Safe, affordable, accredited medical tourism since 2010.
Muted: Secondary text for captions, meta information, and less critical content.
Text link example — stands out with underline and color.
Bold text and italic text and inline code.
🔘 Buttons
Variants (md size, 44px touch target)
Sizes
States
Block (full width)
🏷️ Badges & Pills
Color Variants
Primary Secondary Trust Warning Danger Muted Outline
Status Badges
Verified Hospital Medically Reviewed Updated Jun 2026
📝 Forms
Enter your full name as on your passport.
Please enter a valid email address.
🃏 Cards
Standard Card
Cards have soft shadows, rounded corners, and subtle hover elevation.
Interactive Card
This card is clickable — hover changes border color.
Featured Card
Gradient background for featured content.
⚠️ Disclaimers & Notices
Medical Disclaimer
The information on this page is for informational purposes only. It does not constitute medical advice. Always consult a qualified healthcare professional before making medical decisions. SurgeryPlanet does not provide medical diagnosis or treatment.
Cost Disclaimer
Prices shown are estimates based on historical data and may vary. Final costs depend on your specific medical needs, hospital selection, and treatment plan. Contact us for a personalized quote.
Emergency Notice
If you are experiencing a medical emergency, call your local emergency number immediately. Do not use this website for emergency medical situations.
Travel Advisory
Check visa requirements and travel advisories before booking. SurgeryPlanet can assist with medical visa documentation.
🛡️ Trust Box
Quality & Safety Guaranteed
All partner hospitals are JCI, ISO, or TEMOS accredited. We verify credentials, certifications, and patient outcomes before listing any hospital or surgeon on SurgeryPlanet. Your safety is our priority.
💬 Quote CTA Section
Get Your Free Treatment Quote
Compare hospitals, costs, and surgeons. No obligation, 100% free.
Get Free Quote📊 Tables
Standard Table
| Destination | Avg Cost | Savings |
|---|---|---|
| India | $3,500 | 65-90% |
| Turkey | $4,200 | 50-70% |
| Thailand | $4,800 | 50-75% |
Comparison Table
| Feature | India | Turkey | Mexico |
|---|---|---|---|
| JCI Accredited | ✅ | ✅ | ✅ |
| English Speaking | ✅ | ✅ | Partial |
| Avg Savings | 65-90% | 50-70% | 40-65% |
| Visa Required | Yes | Yes | No (US) |
🧭 Breadcrumbs
📄 Pagination
🔍 Filter Panel
Specialty
Region
Accreditation
📢 Ad Block Placeholder
📱 Responsive Grid (Cards)
Card 1
Cards auto-fill the row based on available width. Resize to see the grid adapt.
Card 2
Cards auto-fill the row based on available width. Resize to see the grid adapt.
Card 3
Cards auto-fill the row based on available width. Resize to see the grid adapt.
Card 4
Cards auto-fill the row based on available width. Resize to see the grid adapt.
Card 5
Cards auto-fill the row based on available width. Resize to see the grid adapt.
Card 6
Cards auto-fill the row based on available width. Resize to see the grid adapt.