📅Date & Time

Date Range Formatting

Clean ways to display start and end dates/times.

Explanation

Ranges should be concise, avoiding repeated months or years when they are the same.

Examples

Same Month
Output
Jan 12–15, 2024
Diff Months
Output
Jan 30 – Feb 2, 2024
Diff Years
Output
Dec 28, 2023 – Jan 5, 2024

Code Examples

Typography 
Use en-dash (–) for ranges, not hyphen (-).
Bad: 2024-2025
Good: 2024–2025

💡 Tips

  • Use an en-dash (–) without spaces for numeric ranges
  • Use an en-dash with spaces for complex date strings
  • Keep the format consistent across the site

⚠️ Common Pitfalls

  • Repeating the year multiple times adds clutter
  • Confusing start and end date order
← Back to All Templates