Day.js 플레이그라운드·포맷 참고표
Day.js 포맷과 파싱을 바로 시험하고 토큰표, 로케일, 복사용 코드를 제공합니다
- 파일이 기기 밖으로 나가지 않습니다
- 브라우저에서 실행
- 무료, 가입 불필요, 워터마크 없음
Day.js 불러오는 중…
포맷 플레이그라운드
출력
포맷 토큰
토큰을 클릭하면 포맷 문자열에 삽입됩니다. 예시는 기준 날짜와 로캘로 표시됩니다.
| 토큰 | 예시 | 의미 | Day.js |
|---|---|---|---|
| 연도와 분기 | |||
| 네 자리 연도 | 기본 | ||
| 두 자리 연도 | 기본 | ||
| 분기(1–4) | advancedFormat | ||
| Day.js 미지원 | 분기(서수) | Day.js 미지원 | |
| 월 | |||
| 월(1–12) | 기본 | ||
| Day.js 미지원 | 월(서수) | Day.js 미지원 | |
| 월(두 자리) | 기본 | ||
| 월 약칭 | 기본 | ||
| 월 이름 | 기본 | ||
| 일(월 기준 / 연 기준) | |||
| 일 | 기본 | ||
| 일(서수) | advancedFormat | ||
| 일(두 자리) | 기본 | ||
| Day.js 미지원 | 연중 일수 | Day.js 미지원 | |
| Day.js 미지원 | 연중 일수(세 자리) | Day.js 미지원 | |
| 요일 | |||
| 요일 번호(0 = 일요일) | 기본 | ||
| 요일(가장 짧게) | 기본 | ||
| 요일(약칭) | 기본 | ||
| 요일(전체) | 기본 | ||
| Day.js 미지원 | 요일 번호(로캘 기준) | Day.js 미지원 | |
| Day.js 미지원 | ISO 요일 번호(1 = 월요일) | Day.js 미지원 | |
| 주 | |||
| 연중 주차(로캘 기준) | advancedFormat + weekOfYear | ||
| 주차(서수) | advancedFormat + weekOfYear | ||
| 주차(두 자리) | advancedFormat + weekOfYear | ||
| ISO 주차 | advancedFormat + isoWeek | ||
| ISO 주차(두 자리) | advancedFormat + isoWeek | ||
| 주 기준 연도(로캘 기준) | advancedFormat + weekYear | ||
| ISO 주 기준 연도 | advancedFormat + isoWeek | ||
| 시 | |||
| 시, 0–23 | 기본 | ||
| 시, 00–23 | 기본 | ||
| 시, 1–12 | 기본 | ||
| 시, 01–12 | 기본 | ||
| 시, 1–24 | advancedFormat | ||
| 시, 01–24 | advancedFormat | ||
| 분과 초 | |||
| 분 | 기본 | ||
| 분(두 자리) | 기본 | ||
| 초 | 기본 | ||
| 초(두 자리) | 기본 | ||
| Day.js 미지원 | 10분의 1초 | Day.js 미지원 | |
| Day.js 미지원 | 100분의 1초 | Day.js 미지원 | |
| 밀리초 | 기본 | ||
| 오전 / 오후 | |||
| AM / PM(오전 / 오후) | 기본 | ||
| am / pm(소문자) | 기본 | ||
| 시간대 | |||
| UTC 오프셋, ±HH:mm | 기본 | ||
| UTC 오프셋, ±HHmm | 기본 | ||
| 시간대 약칭 | advancedFormat + timezone | ||
| 시간대 이름 | advancedFormat + timezone | ||
| Unix 시간 | |||
| Unix 초 | advancedFormat | ||
| Unix 밀리초 | advancedFormat | ||
| 로캘 포맷 | |||
| 로캘 시간 | localizedFormat | ||
| 로캘 시간(초 포함) | localizedFormat | ||
| 로캘 숫자 날짜 | localizedFormat | ||
| 로캘 날짜(월 이름 포함) | localizedFormat | ||
| 로캘 날짜와 시간 | localizedFormat | ||
| 로캘 날짜, 요일, 시간 | localizedFormat | ||
| 짧은 숫자 날짜 | localizedFormat | ||
| 짧은 날짜(월 이름 포함) | localizedFormat | ||
| 짧은 날짜와 시간 | localizedFormat | ||
| 짧은 날짜, 요일, 시간 | localizedFormat | ||
| 이스케이프 | |||
| 대괄호 안의 글자는 그대로 출력 | 기본 | ||
파싱 플레이그라운드
비워 두면 ISO 8601로 파싱합니다.
상대 시간
각 행은 기준 날짜를 옮긴 뒤 from()과 calendar()로 기준과의 관계를 표현합니다.
| 이동 | from(ref) | calendar(ref) |
|---|---|---|
| .add(-45, 'second') | ||
| .add(-10, 'minute') | ||
| .add(-3, 'hour') | ||
| .add(-1, 'day') | ||
| .add(-5, 'day') | ||
| .add(-3, 'month') | ||
| .add(-2, 'year') | ||
| .add(30, 'minute') | ||
| .add(2, 'day') | ||
| .add(1, 'month') |
기간(Duration)
자주 쓰는 코드
일상적인 작업을 실시간 결과와 함께 보여 줍니다. ‘해 보기’를 누르면 아래 코드 실행기에 불러옵니다.
| 작업 | Day.js |
|---|---|
현재 시간 포맷 | dayjs().format('YYYY-MM-DD HH:mm:ss')→ |
일수 더하기 | dayjs('2023-01-01').add(1, 'day').format('YYYY-MM-DD')→ |
지금으로부터 얼마나 Day.js: relativeTime | dayjs().subtract(7, 'day').fromNow()→ |
이번 달 첫날 | dayjs().startOf('month').format('YYYY-MM-DD')→ |
올해 마지막 날 | dayjs().endOf('year').format('YYYY-MM-DD')→ |
이번 주 시작(로캘 기준) | dayjs().startOf('week').format('YYYY-MM-DD ddd')→ |
두 날짜 사이 일수 | dayjs().diff(dayjs('2022-01-01'), 'day')→ |
이번 달 일수 | dayjs().daysInMonth()→ |
분기 Day.js: quarterOfYear | dayjs().quarter()→ |
달력식 시간 Day.js: calendar | dayjs().add(1, 'day').calendar()→ |
두 날짜 사이인지 Day.js: isBetween | dayjs('2024-12-31').isBetween('2024-01-01', '2025-01-01')→ |
오늘인지 Day.js: isToday | dayjs().isToday()→ |
윤년인지 Day.js: isLeapYear | dayjs('2024-01-01').isLeapYear()→ |
날짜를 엄격하게 검증 Day.js: customParseFormat | dayjs('2023-02-30', 'YYYY-MM-DD', true).isValid()→ |
사용자 지정 포맷 파싱 Day.js: customParseFormat | dayjs('13/10/2026 14:30', 'DD/MM/YYYY HH:mm').format()→ |
Unix 타임스탬프(초) | dayjs().unix()→ |
현재 UTC 시간 Day.js: utc | dayjs.utc().format()→ |
다른 시간대의 시간 Day.js: utc + timezone + advancedFormat | dayjs().tz('America/New_York').format('YYYY-MM-DD HH:mm z')→ |
기간을 자연어로 Day.js: duration + relativeTime | dayjs.duration(90, 'minutes').humanize()→ |
월말에 한 달 더하기 | dayjs('2026-01-31').add(1, 'month').format('YYYY-MM-DD')→ |
재할당 없이 add() 호출 | (() => { const d = dayjs('2026-01-01'); d.add(1, 'day'); return d.format('YYYY-MM-DD') })()→ |
코드 실행기
dayjs를 사용하는 식을 입력하면 브라우저에서 바로 실행합니다. 위 코드에 쓰인 플러그인이 모두 켜져 있고, 위에서 고른 로캘이 적용됩니다.
결과
Day.js 플레이그라운드·포맷 참고표 사용 방법
지정한 날짜로 Day.js의 포맷, 파싱, 상대 시간, 기간을 바로 시험해 볼 수 있습니다. 결과마다 필요한 import와 dayjs.extend() 코드가 함께 나오고, 포맷 토큰 표에서 토큰별로 필요한 플러그인을 확인할 수 있습니다.
- 1
‘기준 날짜와 시간’을 정하고(또는 ‘지금’을 누르고) ‘로캘’을 고릅니다. 코드에서 dayjs.utc()를 쓴다면 ‘UTC로 처리’를 켭니다.
- 2
‘포맷 문자열’에 형식을 입력하거나 자주 쓰는 포맷을 누릅니다. ‘포맷 토큰’ 표에서 토큰을 누르면 커서 위치에 들어갑니다.
- 3
‘출력’ 아래에 생성된 코드를 복사합니다. 필요한 플러그인 import가 이미 들어 있습니다.
- 4
‘파싱 플레이그라운드’에서 날짜 문자열과 예상 포맷을 입력하고, ‘엄격 파싱’을 켜면 존재하지 않는 날짜를 걸러 냅니다.
- 5
‘자주 쓰는 코드’에서 ‘해 보기’를 누르면 코드가 ‘코드 실행기’에 들어가며, 수정하면 결과가 바로 바뀝니다.
자주 묻는 질문
포맷 토큰마다 어떤 플러그인이 필요한가요?
‘포맷 토큰’ 표의 Day.js 열에 ‘기본’ 또는 플러그인 이름이 표시됩니다. 예를 들어 Do·Q·X에는 advancedFormat, L·LLLL에는 localizedFormat이 필요합니다. 생성된 코드에는 해당 import와 dayjs.extend()가 자동으로 들어갑니다.
여기서는 맞게 나오는 토큰이 내 프로젝트에서는 왜 이상하게 나오나요?
이 페이지는 모든 플러그인을 불러옵니다. Day.js 코어는 아는 토큰만 바꾸므로 advancedFormat이 없으면 Q는 그대로 남고, Do는 날짜 숫자 뒤에 o가 붙어 나옵니다. 표에 적힌 플러그인을 extend하세요. DDD, E 같은 일부 Moment 토큰은 Day.js에 아예 없습니다.
2023-02-30이 왜 유효한 날짜로 나오나요?
엄격 모드가 아니면 Day.js는 존재하지 않는 날짜를 다음 달로 넘깁니다. ‘엄격 파싱’(customParseFormat 플러그인과 세 번째 인수 true)을 켜면 같은 입력이 유효하지 않은 날짜로 표시됩니다.
포맷 안에 일반 텍스트를 넣으려면 어떻게 하나요?
대괄호로 감쌉니다. 예를 들어 [Week] W, GGGG는 Week라는 단어 뒤에 ISO 주차와 연도를 출력합니다.
코드 실행기의 코드가 외부로 전송되나요?
아니요. Day.js와 플러그인, 로캘 파일은 이 페이지 안에서 동작하며, 입력한 식은 브라우저에서 실행됩니다. 자주 쓰는 코드에 쓰인 플러그인은 모두 켜져 있습니다.
다른 시간대의 시간으로 바꿀 수 있나요?
자주 쓰는 코드의 ‘다른 시간대의 시간’에서 utc와 timezone 플러그인을 쓴 dayjs().tz() 예시를 볼 수 있습니다. 여러 시간대를 나란히 비교하려면 ‘시간대 변환’을 이용하세요.