-
-
Notifications
You must be signed in to change notification settings - Fork 2.5k
Expand file tree
/
Copy pathdisplaying.html
More file actions
156 lines (156 loc) · 54.2 KB
/
Copy pathdisplaying.html
File metadata and controls
156 lines (156 loc) · 54.2 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
<!DOCTYPE html>
<html lang="en"><head><meta charset="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><title>Display - dayjs</title><meta name="description" content="Day.js provides methods to format and display dates in various ways."/><meta name="generator" content="Sourcey 3.6.4"/><meta property="og:title" content="Display - dayjs"/><meta property="og:description" content="Day.js provides methods to format and display dates in various ways."/><meta property="og:type" content="website"/><meta property="og:site_name" content="dayjs"/><meta property="og:image" content="../_og/documentation/displaying.png"/><meta property="og:image:width" content="1200"/><meta property="og:image:height" content="630"/><meta property="og:image:type" content="image/png"/><meta name="twitter:card" content="summary_large_image"/><meta name="twitter:title" content="Display - dayjs"/><meta name="twitter:description" content="Day.js provides methods to format and display dates in various ways."/><meta name="twitter:image" content="../_og/documentation/displaying.png"/><meta name="sourcey-search" content="../search-index.json"/><link rel="preconnect" href="https://fonts.googleapis.com"/><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="anonymous"/><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap"/><style>
:root {
--color-primary: 121 40 202;
--color-primary-light: 121 40 202;
--color-primary-dark: 121 40 202;
--color-primary-ink: 121 40 202;
--color-background-light: 255 255 255;
--color-background-dark: 11 12 16;
--font-sans: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
--font-mono: ui-monospace, 'SF Mono', 'Cascadia Code', Consolas, 'Liberation Mono', Menlo, monospace;
--sidebar-width: 18rem;
--toc-width: 19rem;
--content-max-width: 44rem;
--header-height: 7.5rem;
}
html { scroll-padding-top: var(--header-height); }
@media (min-width: 1024px) {
:root { --header-height: 4rem; }
}
body { margin: 0; background: rgb(var(--color-background-light)); }
.dark body { background: rgb(var(--color-background-dark)); }
</style><script>(function(){var t=localStorage.getItem('sourcey-theme');if(t==='dark')document.documentElement.classList.add('dark')})()</script><link rel="stylesheet" href="../sourcey.css"/></head><body id="sourcey"><div id="page" class="relative antialiased text-[rgb(var(--color-gray-500))] dark:text-[rgb(var(--color-gray-400))]"><div id="navbar" class="z-30 fixed lg:sticky top-0 w-full"><div class="absolute w-full h-full flex-none border-b border-[rgb(var(--color-gray-200)/0.7)] dark:border-[rgb(var(--color-gray-300)/0.06)] bg-[rgb(var(--color-background-light))] dark:bg-[rgb(var(--color-background-dark))]"></div><div class="max-w-[92rem] mx-auto relative"><div class="relative"><div class="flex items-center lg:px-12 h-16 min-w-0 mx-4 lg:mx-0"><div class="h-full relative flex-1 flex items-center gap-x-4 min-w-0 border-b border-[rgb(var(--color-gray-500)/0.08)] dark:border-[rgb(var(--color-gray-300)/0.08)]"><div class="flex-1 flex items-center gap-x-4"><a href="../documentation/introduction.html" class="select-none inline-block"><span class="text-sm font-semibold text-[rgb(var(--color-gray-900))] dark:text-[rgb(var(--color-gray-200))]">dayjs</span></a></div><div class="relative hidden lg:flex items-center flex-1 z-20 gap-2"><button id="search-open" type="button" class="group flex pointer-events-auto rounded-lg w-full items-center text-sm leading-6 h-9 pl-3.5 pr-3 text-[rgb(var(--color-gray-500))] dark:text-[rgb(var(--color-gray-400))] ring-1 ring-[rgb(var(--color-gray-400)/0.3)] hover:ring-[rgb(var(--color-gray-600)/0.3)] dark:ring-[rgb(var(--color-gray-600)/0.3)] dark:hover:ring-[rgb(var(--color-gray-500)/0.3)] justify-between truncate gap-2 min-w-[43px] cursor-pointer bg-[rgb(var(--color-background-light))] dark:bg-[rgb(var(--color-background-dark))] dark:brightness-110 dark:hover:brightness-125"><div class="flex items-center gap-2 min-w-[42px]"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" class="min-w-4 flex-none"><circle cx="11" cy="11" r="8"></circle><path d="m21 21-4.3-4.3"></path></svg><div class="truncate min-w-0">Type <kbd>/</kbd> to search</div></div></button></div><div class="flex-1 relative hidden lg:flex items-center ml-auto justify-end space-x-4"><nav class="text-sm"><ul class="flex space-x-6 items-center"><li><a href="https://github.com/iamkun/dayjs" target="_blank" rel="noopener noreferrer" aria-label="GitHub" class="text-[rgb(var(--color-gray-500))] hover:text-[rgb(var(--color-gray-700))] dark:text-[rgb(var(--color-gray-400))] dark:hover:text-[rgb(var(--color-gray-300))]"><svg viewBox="0 0 24 24" fill="currentColor" class="w-5 h-5"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg></a></li></ul></nav><button id="theme-toggle" type="button" aria-label="Toggle theme" class="p-2 flex items-center justify-center cursor-pointer text-[rgb(var(--color-gray-400))] hover:text-[rgb(var(--color-gray-600))] dark:text-[rgb(var(--color-gray-500))] dark:hover:text-[rgb(var(--color-gray-300))]"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" class="h-4 w-4 block dark:hidden"><g stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M8 1.11V2"></path><path d="M12.87 3.13L12.24 3.76"></path><path d="M14.89 8H14"></path><path d="M12.87 12.87L12.24 12.24"></path><path d="M8 14.89V14"></path><path d="M3.13 12.87L3.76 12.24"></path><path d="M1.11 8H2"></path><path d="M3.13 3.13L3.76 3.76"></path><circle cx="8" cy="8" r="3.78"></circle></g></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" class="h-4 w-4 hidden dark:block"><path d="M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z"></path></svg></button></div><div class="flex lg:hidden items-center gap-3"><button id="search-open-mobile" type="button" aria-label="Search" class="text-[rgb(var(--color-gray-500))] w-8 h-8 flex items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" class="min-w-4 flex-none"><circle cx="11" cy="11" r="8"></circle><path d="m21 21-4.3-4.3"></path></svg></button><button type="button" data-drawer-slide="right" aria-label="Open menu" class="text-[rgb(var(--color-gray-500))] w-8 h-8 flex items-center justify-center hover:text-[rgb(var(--color-gray-600))]"><svg class="h-4" fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M0 96C0 78.3 14.3 64 32 64H416c17.7 0 32 14.3 32 32s-14.3 32-32 32H32C14.3 128 0 113.7 0 96zM0 256c0-17.7 14.3-32 32-32H416c17.7 0 32 14.3 32 32s-14.3 32-32 32H32c-17.7 0-32-14.3-32-32zM448 416c0 17.7-14.3 32-32 32H32c-17.7 0-32-14.3-32-32s14.3-32 32-32H416c17.7 0 32 14.3 32 32z"></path></svg></button></div></div></div></div><div class="flex lg:hidden items-center h-14 px-5 text-sm overflow-hidden"><div class="flex items-center min-w-0 space-x-3 leading-6 whitespace-nowrap"><span class="font-semibold text-[rgb(var(--color-gray-900))] dark:text-[rgb(var(--color-gray-200))] truncate min-w-0">Display</span></div></div></div></div><span class="fixed inset-0 bg-[rgb(var(--color-background-light))] dark:bg-[rgb(var(--color-background-dark))] -z-10 pointer-events-none"></span><div class="max-w-[92rem] mx-auto relative px-4 lg:px-8"><div id="sidebar" class="z-20 hidden lg:block fixed bottom-0 right-auto w-[18rem]" style="top: var(--header-height)"><div class="absolute inset-0 z-10 overflow-auto pr-8 pb-10" data-sourcey-sidebar-scroll="true" data-sourcey-sidebar-tab="documentation"><div class="relative text-sm leading-6"><div class="sticky top-0 h-8 z-10 bg-gradient-to-b from-[rgb(var(--color-background-light))] dark:from-[rgb(var(--color-background-dark))]"></div><nav id="nav" role="navigation"><div class><h5 class="nav-group-label">Getting Started</h5><ul class="space-y-px"><li><a href="../documentation/introduction.html" class="nav-link"><span class="flex-1 break-words [word-break:break-word]">Introduction to Day.js</span></a></li><li><a href="../documentation/installation.html" class="nav-link"><span class="flex-1 break-words [word-break:break-word]">Installation</span></a></li></ul></div><div class="mt-6 lg:mt-8"><h5 class="nav-group-label">API Reference</h5><ul class="space-y-px"><li><a href="../documentation/parsing.html" class="nav-link"><span class="flex-1 break-words [word-break:break-word]">Parsing</span></a></li><li><a href="../documentation/get-set.html" class="nav-link"><span class="flex-1 break-words [word-break:break-word]">Get + Set</span></a></li><li><a href="../documentation/manipulating.html" class="nav-link"><span class="flex-1 break-words [word-break:break-word]">Manipulating</span></a></li><li><a href="../documentation/displaying.html" class="nav-link active"><span class="flex-1 break-words [word-break:break-word]">Display</span></a></li><li><a href="../documentation/querying.html" class="nav-link"><span class="flex-1 break-words [word-break:break-word]">Query</span></a></li><li><a href="../documentation/formatting.html" class="nav-link"><span class="flex-1 break-words [word-break:break-word]">Formatting Tokens</span></a></li></ul></div><div class="mt-6 lg:mt-8"><h5 class="nav-group-label">Advanced</h5><ul class="space-y-px"><li><a href="../documentation/plugins.html" class="nav-link"><span class="flex-1 break-words [word-break:break-word]">Plugins</span></a></li><li><a href="../documentation/i18n.html" class="nav-link"><span class="flex-1 break-words [word-break:break-word]">Internationalization (i18n)</span></a></li></ul></div></nav></div></div></div><dialog id="mobile-nav" class="mobile-nav-dialog"><nav class="pt-5 pb-3 px-4 flex-1 overflow-y-auto"><div class><h5 class="nav-group-label">Getting Started</h5><ul class="space-y-px"><li><a href="../documentation/introduction.html" class="nav-link"><span class="flex-1 break-words [word-break:break-word]">Introduction to Day.js</span></a></li><li><a href="../documentation/installation.html" class="nav-link"><span class="flex-1 break-words [word-break:break-word]">Installation</span></a></li></ul></div><div class="mt-6 lg:mt-8"><h5 class="nav-group-label">API Reference</h5><ul class="space-y-px"><li><a href="../documentation/parsing.html" class="nav-link"><span class="flex-1 break-words [word-break:break-word]">Parsing</span></a></li><li><a href="../documentation/get-set.html" class="nav-link"><span class="flex-1 break-words [word-break:break-word]">Get + Set</span></a></li><li><a href="../documentation/manipulating.html" class="nav-link"><span class="flex-1 break-words [word-break:break-word]">Manipulating</span></a></li><li><a href="../documentation/displaying.html" class="nav-link active"><span class="flex-1 break-words [word-break:break-word]">Display</span></a></li><li><a href="../documentation/querying.html" class="nav-link"><span class="flex-1 break-words [word-break:break-word]">Query</span></a></li><li><a href="../documentation/formatting.html" class="nav-link"><span class="flex-1 break-words [word-break:break-word]">Formatting Tokens</span></a></li></ul></div><div class="mt-6 lg:mt-8"><h5 class="nav-group-label">Advanced</h5><ul class="space-y-px"><li><a href="../documentation/plugins.html" class="nav-link"><span class="flex-1 break-words [word-break:break-word]">Plugins</span></a></li><li><a href="../documentation/i18n.html" class="nav-link"><span class="flex-1 break-words [word-break:break-word]">Internationalization (i18n)</span></a></li></ul></div></nav><div class="px-4 py-3 border-t border-[rgb(var(--color-gray-200)/0.7)] dark:border-[rgb(var(--color-gray-800)/0.5)] shrink-0"><ul class="space-y-3"><li><a href="https://github.com/iamkun/dayjs" target="_blank" rel="noopener noreferrer" class="flex items-center gap-2.5 text-[rgb(var(--color-gray-600))] hover:text-[rgb(var(--color-gray-900))] dark:text-[rgb(var(--color-gray-400))] dark:hover:text-[rgb(var(--color-gray-200))]"><svg viewBox="0 0 24 24" fill="currentColor" class="w-5 h-5"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg><span>GitHub</span></a></li></ul></div></dialog><main id="docs" class="pt-[8.5rem] lg:pt-10"><div class="flex flex-row-reverse gap-12 box-border w-full"><aside id="toc" class="hidden xl:flex self-start sticky xl:flex-col max-w-[28rem] z-[21]" style="height: calc(100vh - var(--header-height) - 2.5rem); top: calc(var(--header-height) + 2.5rem)"><div class="z-10 hidden xl:flex box-border max-h-full pl-10 w-[19rem]"><div class="text-[rgb(var(--color-gray-600))] text-sm leading-6 w-[16.5rem] overflow-y-auto space-y-2 pb-4 -mt-10 pt-10"><h5 class="font-medium text-[rgb(var(--color-gray-700))] dark:text-[rgb(var(--color-gray-300))] flex items-center gap-2"><svg class="shrink-0" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path stroke-linecap="round" stroke-linejoin="round" d="M12 6.042A8.967 8.967 0 0 0 6 3.75c-1.052 0-2.062.18-3 .512v14.25A8.987 8.987 0 0 1 6 18c2.305 0 4.408.867 6 2.292m0-14.25a8.966 8.966 0 0 1 6-2.292c1.052 0 2.062.18 3 .512v14.25A8.987 8.987 0 0 0 18 18a8.967 8.967 0 0 0-6 2.292m0-14.25v14.25"/></svg>On this page</h5><nav><ul><li><a href="#format" class="toc-item break-words block hover:text-[rgb(var(--color-gray-900))] dark:hover:text-[rgb(var(--color-gray-300))] dark:text-[rgb(var(--color-gray-400))] transition-colors py-1 font-medium">Format</a></li><li><a href="#time-from-now-with-relativetime-plugin" class="toc-item break-words block hover:text-[rgb(var(--color-gray-900))] dark:hover:text-[rgb(var(--color-gray-300))] dark:text-[rgb(var(--color-gray-400))] transition-colors py-1 font-medium">Time from Now (with RelativeTime plugin)</a></li><li><a href="#time-from-x-with-relativetime-plugin" class="toc-item break-words block hover:text-[rgb(var(--color-gray-900))] dark:hover:text-[rgb(var(--color-gray-300))] dark:text-[rgb(var(--color-gray-400))] transition-colors py-1 font-medium">Time from X (with RelativeTime plugin)</a></li><li><a href="#time-to-now-to-x-with-relativetime-plugin" class="toc-item break-words block hover:text-[rgb(var(--color-gray-900))] dark:hover:text-[rgb(var(--color-gray-300))] dark:text-[rgb(var(--color-gray-400))] transition-colors py-1 font-medium">Time to Now / to X (with RelativeTime plugin)</a></li><li><a href="#calendar-time-with-calendar-plugin" class="toc-item break-words block hover:text-[rgb(var(--color-gray-900))] dark:hover:text-[rgb(var(--color-gray-300))] dark:text-[rgb(var(--color-gray-400))] transition-colors py-1 font-medium">Calendar Time (with Calendar plugin)</a></li><li><a href="#difference" class="toc-item break-words block hover:text-[rgb(var(--color-gray-900))] dark:hover:text-[rgb(var(--color-gray-300))] dark:text-[rgb(var(--color-gray-400))] transition-colors py-1 font-medium">Difference</a></li><li><a href="#unix-timestamps" class="toc-item break-words block hover:text-[rgb(var(--color-gray-900))] dark:hover:text-[rgb(var(--color-gray-300))] dark:text-[rgb(var(--color-gray-400))] transition-colors py-1 font-medium">Unix Timestamps</a></li><li><a href="#days-in-month" class="toc-item break-words block hover:text-[rgb(var(--color-gray-900))] dark:hover:text-[rgb(var(--color-gray-300))] dark:text-[rgb(var(--color-gray-400))] transition-colors py-1 font-medium">Days in Month</a></li><li><a href="#native-javascript-date-output" class="toc-item break-words block hover:text-[rgb(var(--color-gray-900))] dark:hover:text-[rgb(var(--color-gray-300))] dark:text-[rgb(var(--color-gray-400))] transition-colors py-1 font-medium">Native JavaScript Date Output</a></li></ul></nav></div></div></aside><div class="relative grow box-border flex-col w-full mx-auto px-1 min-w-0 lg:pl-[23.7rem] lg:-ml-12 xl:w-[calc(100%-28rem)]" id="content-area"><header class="relative leading-none"><div class="mt-0.5 space-y-2.5"><div class="h-5 text-[rgb(var(--color-primary-ink))] dark:text-[rgb(var(--color-primary-light))] text-sm font-semibold">API Reference</div><div class="flex flex-col sm:flex-row items-start sm:items-center relative gap-2 min-w-0"><h1 class="text-2xl sm:text-3xl text-[rgb(var(--color-gray-900))] tracking-tight dark:text-[rgb(var(--color-gray-200))] font-bold" style="overflow-wrap: anywhere">Display</h1></div></div><div class="page-description mt-2 text-lg prose prose-gray dark:prose-invert" style="overflow-wrap: anywhere"><span>Day.js provides methods to format and display dates in various ways.</span></div></header><div class="prose prose-gray dark:prose-invert relative mt-8 mb-14 max-w-none"><p>Day.js provides methods to format and display dates in various ways.</p>
<h2 id="format">Format</h2>
<div class="prose-code-block not-prose">
<div class="prose-code-copy">
<button aria-label="Copy code" class="copy-btn" type="button" data-copy-source="code"><svg fill="none" height="18" width="18" xmlns="http://www.w3.org/2000/svg">Copy<path d="M14.25 5.25H7.25C6.14543 5.25 5.25 6.14543 5.25 7.25V14.25C5.25 15.3546 6.14543 16.25 7.25 16.25H14.25C15.3546 16.25 16.25 15.3546 16.25 14.25V7.25C16.25 6.14543 15.3546 5.25 14.25 5.25Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M2.80103 11.998L1.77203 5.07397C1.61003 3.98097 2.36403 2.96397 3.45603 2.80197L10.38 1.77297C11.313 1.63397 12.19 2.16297 12.528 3.00097" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button>
</div>
<div class="prose-code-content"><pre class="shiki shiki-themes github-light-default dark-plus" style="--shiki-light:#1f2328;--shiki-dark:#D4D4D4;--shiki-light-bg:#ffffff;--shiki-dark-bg:#1E1E1E" tabindex="0"><code><span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-06-15'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">).</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">format</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">();</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// "2024-06-15T00:00:00+03:00" (ISO 8601)</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-06-15'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">).</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">format</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'YYYY-MM-DD'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">);</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// "2024-06-15"</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-06-15'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">).</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">format</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'dddd, MMMM D, YYYY'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">);</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// "Saturday, June 15, 2024"</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-06-15'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">).</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">format</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'HH:mm:ss'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">);</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// "00:00:00"</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-06-15'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">).</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">format</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'MM/DD/YYYY h:mm A'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">);</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// "06/15/2024 12:00 AM"</span></span></code></pre></div>
</div><h2 id="time-from-now-with-relativetime-plugin">Time from Now (with RelativeTime plugin)</h2>
<div class="prose-code-block not-prose">
<div class="prose-code-copy">
<button aria-label="Copy code" class="copy-btn" type="button" data-copy-source="code"><svg fill="none" height="18" width="18" xmlns="http://www.w3.org/2000/svg">Copy<path d="M14.25 5.25H7.25C6.14543 5.25 5.25 6.14543 5.25 7.25V14.25C5.25 15.3546 6.14543 16.25 7.25 16.25H14.25C15.3546 16.25 16.25 15.3546 16.25 14.25V7.25C16.25 6.14543 15.3546 5.25 14.25 5.25Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M2.80103 11.998L1.77203 5.07397C1.61003 3.98097 2.36403 2.96397 3.45603 2.80197L10.38 1.77297C11.313 1.63397 12.19 2.16297 12.528 3.00097" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button>
</div>
<div class="prose-code-content"><pre class="shiki shiki-themes github-light-default dark-plus" style="--shiki-light:#1f2328;--shiki-dark:#D4D4D4;--shiki-light-bg:#ffffff;--shiki-dark-bg:#1E1E1E" tabindex="0"><code><span class="line"><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">.</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">extend</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">RelativeTime</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">);</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2020-01-01'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">).</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">fromNow</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">();</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// "4 years ago"</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">().</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">fromNow</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">();</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// "a few seconds ago"</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">().</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">fromNow</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0550AE;--shiki-dark:#569CD6">true</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">); </span><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// without suffix</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// "a few seconds"</span></span></code></pre></div>
</div><h2 id="time-from-x-with-relativetime-plugin">Time from X (with RelativeTime plugin)</h2>
<div class="prose-code-block not-prose">
<div class="prose-code-copy">
<button aria-label="Copy code" class="copy-btn" type="button" data-copy-source="code"><svg fill="none" height="18" width="18" xmlns="http://www.w3.org/2000/svg">Copy<path d="M14.25 5.25H7.25C6.14543 5.25 5.25 6.14543 5.25 7.25V14.25C5.25 15.3546 6.14543 16.25 7.25 16.25H14.25C15.3546 16.25 16.25 15.3546 16.25 14.25V7.25C16.25 6.14543 15.3546 5.25 14.25 5.25Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M2.80103 11.998L1.77203 5.07397C1.61003 3.98097 2.36403 2.96397 3.45603 2.80197L10.38 1.77297C11.313 1.63397 12.19 2.16297 12.528 3.00097" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button>
</div>
<div class="prose-code-content"><pre class="shiki shiki-themes github-light-default dark-plus" style="--shiki-light:#1f2328;--shiki-dark:#D4D4D4;--shiki-light-bg:#ffffff;--shiki-dark-bg:#1E1E1E" tabindex="0"><code><span class="line"><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">.</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">extend</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">RelativeTime</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">);</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#CF222E;--shiki-dark:#569CD6">const</span><span style="--shiki-light:#0550AE;--shiki-dark:#4FC1FF"> a</span><span style="--shiki-light:#CF222E;--shiki-dark:#D4D4D4"> =</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA"> dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-01-01'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">);</span></span>
<span class="line"><span style="--shiki-light:#CF222E;--shiki-dark:#569CD6">const</span><span style="--shiki-light:#0550AE;--shiki-dark:#4FC1FF"> b</span><span style="--shiki-light:#CF222E;--shiki-dark:#D4D4D4"> =</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA"> dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-06-15'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">);</span></span>
<span class="line"><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">a</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">.</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">from</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">b</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">); </span><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// "5 months ago"</span></span>
<span class="line"><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">b</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">.</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">from</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">a</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">); </span><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// "in 5 months"</span></span></code></pre></div>
</div><h2 id="time-to-now-to-x-with-relativetime-plugin">Time to Now / to X (with RelativeTime plugin)</h2>
<div class="prose-code-block not-prose">
<div class="prose-code-copy">
<button aria-label="Copy code" class="copy-btn" type="button" data-copy-source="code"><svg fill="none" height="18" width="18" xmlns="http://www.w3.org/2000/svg">Copy<path d="M14.25 5.25H7.25C6.14543 5.25 5.25 6.14543 5.25 7.25V14.25C5.25 15.3546 6.14543 16.25 7.25 16.25H14.25C15.3546 16.25 16.25 15.3546 16.25 14.25V7.25C16.25 6.14543 15.3546 5.25 14.25 5.25Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M2.80103 11.998L1.77203 5.07397C1.61003 3.98097 2.36403 2.96397 3.45603 2.80197L10.38 1.77297C11.313 1.63397 12.19 2.16297 12.528 3.00097" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button>
</div>
<div class="prose-code-content"><pre class="shiki shiki-themes github-light-default dark-plus" style="--shiki-light:#1f2328;--shiki-dark:#D4D4D4;--shiki-light-bg:#ffffff;--shiki-dark-bg:#1E1E1E" tabindex="0"><code><span class="line"><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">.</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">extend</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">RelativeTime</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">);</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2020-01-01'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">).</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">toNow</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">();</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// "in 4 years"</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#CF222E;--shiki-dark:#569CD6">const</span><span style="--shiki-light:#0550AE;--shiki-dark:#4FC1FF"> a</span><span style="--shiki-light:#CF222E;--shiki-dark:#D4D4D4"> =</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA"> dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-01-01'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">);</span></span>
<span class="line"><span style="--shiki-light:#CF222E;--shiki-dark:#569CD6">const</span><span style="--shiki-light:#0550AE;--shiki-dark:#4FC1FF"> b</span><span style="--shiki-light:#CF222E;--shiki-dark:#D4D4D4"> =</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA"> dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-06-15'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">);</span></span>
<span class="line"><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">a</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">.</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">to</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">b</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">); </span><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// "in 5 months"</span></span>
<span class="line"><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">b</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">.</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">to</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">a</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">); </span><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// "5 months ago"</span></span></code></pre></div>
</div><h2 id="calendar-time-with-calendar-plugin">Calendar Time (with Calendar plugin)</h2>
<div class="prose-code-block not-prose">
<div class="prose-code-copy">
<button aria-label="Copy code" class="copy-btn" type="button" data-copy-source="code"><svg fill="none" height="18" width="18" xmlns="http://www.w3.org/2000/svg">Copy<path d="M14.25 5.25H7.25C6.14543 5.25 5.25 6.14543 5.25 7.25V14.25C5.25 15.3546 6.14543 16.25 7.25 16.25H14.25C15.3546 16.25 16.25 15.3546 16.25 14.25V7.25C16.25 6.14543 15.3546 5.25 14.25 5.25Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M2.80103 11.998L1.77203 5.07397C1.61003 3.98097 2.36403 2.96397 3.45603 2.80197L10.38 1.77297C11.313 1.63397 12.19 2.16297 12.528 3.00097" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button>
</div>
<div class="prose-code-content"><pre class="shiki shiki-themes github-light-default dark-plus" style="--shiki-light:#1f2328;--shiki-dark:#D4D4D4;--shiki-light-bg:#ffffff;--shiki-dark-bg:#1E1E1E" tabindex="0"><code><span class="line"><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">.</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">extend</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">Calendar</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">);</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">().</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">calendar</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">();</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// "Today at 8:02 PM"</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-06-14'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">).</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">calendar</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">();</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// "Yesterday at 12:00 AM"</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-06-22'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">).</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">calendar</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">();</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// "Next Saturday at 12:00 AM"</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-01-01'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">).</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">calendar</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">();</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// "01/01/2024"</span></span></code></pre></div>
</div><h2 id="difference">Difference</h2>
<div class="prose-code-block not-prose">
<div class="prose-code-copy">
<button aria-label="Copy code" class="copy-btn" type="button" data-copy-source="code"><svg fill="none" height="18" width="18" xmlns="http://www.w3.org/2000/svg">Copy<path d="M14.25 5.25H7.25C6.14543 5.25 5.25 6.14543 5.25 7.25V14.25C5.25 15.3546 6.14543 16.25 7.25 16.25H14.25C15.3546 16.25 16.25 15.3546 16.25 14.25V7.25C16.25 6.14543 15.3546 5.25 14.25 5.25Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M2.80103 11.998L1.77203 5.07397C1.61003 3.98097 2.36403 2.96397 3.45603 2.80197L10.38 1.77297C11.313 1.63397 12.19 2.16297 12.528 3.00097" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button>
</div>
<div class="prose-code-content"><pre class="shiki shiki-themes github-light-default dark-plus" style="--shiki-light:#1f2328;--shiki-dark:#D4D4D4;--shiki-light-bg:#ffffff;--shiki-dark-bg:#1E1E1E" tabindex="0"><code><span class="line"><span style="--shiki-light:#CF222E;--shiki-dark:#569CD6">const</span><span style="--shiki-light:#0550AE;--shiki-dark:#4FC1FF"> a</span><span style="--shiki-light:#CF222E;--shiki-dark:#D4D4D4"> =</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA"> dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-01-01'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">);</span></span>
<span class="line"><span style="--shiki-light:#CF222E;--shiki-dark:#569CD6">const</span><span style="--shiki-light:#0550AE;--shiki-dark:#4FC1FF"> b</span><span style="--shiki-light:#CF222E;--shiki-dark:#D4D4D4"> =</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA"> dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-06-15'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">);</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">b</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">.</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">diff</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">a</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">); </span><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// 14256000000 (milliseconds)</span></span>
<span class="line"><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">b</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">.</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">diff</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">a</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">, </span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'day'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">); </span><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// 166</span></span>
<span class="line"><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">b</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">.</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">diff</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">a</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">, </span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'month'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">); </span><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// 5</span></span>
<span class="line"><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">b</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">.</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">diff</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">a</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">, </span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'year'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">); </span><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// 0</span></span>
<span class="line"><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">b</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">.</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">diff</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#1F2328;--shiki-dark:#9CDCFE">a</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">, </span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'day'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">, </span><span style="--shiki-light:#0550AE;--shiki-dark:#569CD6">true</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">); </span><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// 166 (float)</span></span></code></pre></div>
</div><h2 id="unix-timestamps">Unix Timestamps</h2>
<div class="prose-code-block not-prose">
<div class="prose-code-copy">
<button aria-label="Copy code" class="copy-btn" type="button" data-copy-source="code"><svg fill="none" height="18" width="18" xmlns="http://www.w3.org/2000/svg">Copy<path d="M14.25 5.25H7.25C6.14543 5.25 5.25 6.14543 5.25 7.25V14.25C5.25 15.3546 6.14543 16.25 7.25 16.25H14.25C15.3546 16.25 16.25 15.3546 16.25 14.25V7.25C16.25 6.14543 15.3546 5.25 14.25 5.25Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M2.80103 11.998L1.77203 5.07397C1.61003 3.98097 2.36403 2.96397 3.45603 2.80197L10.38 1.77297C11.313 1.63397 12.19 2.16297 12.528 3.00097" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button>
</div>
<div class="prose-code-content"><pre class="shiki shiki-themes github-light-default dark-plus" style="--shiki-light:#1f2328;--shiki-dark:#D4D4D4;--shiki-light-bg:#ffffff;--shiki-dark-bg:#1E1E1E" tabindex="0"><code><span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-06-15'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">).</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">valueOf</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">();</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// 1718409600000 (milliseconds)</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-06-15'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">).</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">unix</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">();</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// 1718409600 (seconds)</span></span></code></pre></div>
</div><h2 id="days-in-month">Days in Month</h2>
<div class="prose-code-block not-prose">
<div class="prose-code-copy">
<button aria-label="Copy code" class="copy-btn" type="button" data-copy-source="code"><svg fill="none" height="18" width="18" xmlns="http://www.w3.org/2000/svg">Copy<path d="M14.25 5.25H7.25C6.14543 5.25 5.25 6.14543 5.25 7.25V14.25C5.25 15.3546 6.14543 16.25 7.25 16.25H14.25C15.3546 16.25 16.25 15.3546 16.25 14.25V7.25C16.25 6.14543 15.3546 5.25 14.25 5.25Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M2.80103 11.998L1.77203 5.07397C1.61003 3.98097 2.36403 2.96397 3.45603 2.80197L10.38 1.77297C11.313 1.63397 12.19 2.16297 12.528 3.00097" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button>
</div>
<div class="prose-code-content"><pre class="shiki shiki-themes github-light-default dark-plus" style="--shiki-light:#1f2328;--shiki-dark:#D4D4D4;--shiki-light-bg:#ffffff;--shiki-dark-bg:#1E1E1E" tabindex="0"><code><span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-02-01'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">).</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">daysInMonth</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">();</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// 29 (leap year)</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-01-01'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">).</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">daysInMonth</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">();</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// 31</span></span></code></pre></div>
</div><h2 id="native-javascript-date-output">Native JavaScript Date Output</h2>
<div class="prose-code-block not-prose">
<div class="prose-code-copy">
<button aria-label="Copy code" class="copy-btn" type="button" data-copy-source="code"><svg fill="none" height="18" width="18" xmlns="http://www.w3.org/2000/svg">Copy<path d="M14.25 5.25H7.25C6.14543 5.25 5.25 6.14543 5.25 7.25V14.25C5.25 15.3546 6.14543 16.25 7.25 16.25H14.25C15.3546 16.25 16.25 15.3546 16.25 14.25V7.25C16.25 6.14543 15.3546 5.25 14.25 5.25Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M2.80103 11.998L1.77203 5.07397C1.61003 3.98097 2.36403 2.96397 3.45603 2.80197L10.38 1.77297C11.313 1.63397 12.19 2.16297 12.528 3.00097" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button>
</div>
<div class="prose-code-content"><pre class="shiki shiki-themes github-light-default dark-plus" style="--shiki-light:#1f2328;--shiki-dark:#D4D4D4;--shiki-light-bg:#ffffff;--shiki-dark-bg:#1E1E1E" tabindex="0"><code><span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-06-15'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">).</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">toDate</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">();</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// Sat Jun 15 2024 00:00:00 GMT+0300</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-06-15'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">).</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">toJSON</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">();</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// "2024-06-14T21:00:00.000Z"</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-06-15'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">).</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">toISOString</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">();</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// "2024-06-14T21:00:00.000Z"</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-06-15'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">).</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">toArray</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">();</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// [2024, 5, 15, 0, 0, 0, 0]</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-06-15'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">).</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">toObject</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">();</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// { years: 2024, months: 5, date: 15, hours: 0, minutes: 0, seconds: 0, milliseconds: 0 }</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">dayjs</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">(</span><span style="--shiki-light:#0A3069;--shiki-dark:#CE9178">'2024-06-15'</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">).</span><span style="--shiki-light:#8250DF;--shiki-dark:#DCDCAA">toString</span><span style="--shiki-light:#1F2328;--shiki-dark:#D4D4D4">();</span></span>
<span class="line"><span style="--shiki-light:#6E7781;--shiki-dark:#6A9955">// "Sat, 15 Jun 2024 00:00:00 GMT"</span></span></code></pre></div>
</div></div><nav class="mt-12 flex items-stretch justify-between gap-4"><a href="../documentation/manipulating.html" class="group flex flex-col gap-1 px-4 py-3 rounded-lg border border-[rgb(var(--color-gray-200)/0.7)] dark:border-[rgb(var(--color-gray-800)/0.5)] hover:border-[rgb(var(--color-primary)/0.4)] dark:hover:border-[rgb(var(--color-primary-light)/0.3)] transition-colors no-underline"><span class="text-xs text-[rgb(var(--color-gray-500))] dark:text-[rgb(var(--color-gray-400))]">← Previous</span><span class="text-sm font-medium text-[rgb(var(--color-gray-700))] dark:text-[rgb(var(--color-gray-300))] group-hover:text-[rgb(var(--color-primary-ink))] dark:group-hover:text-[rgb(var(--color-primary-light))] transition-colors">Manipulating</span></a><a href="../documentation/querying.html" class="group flex flex-col gap-1 px-4 py-3 rounded-lg border border-[rgb(var(--color-gray-200)/0.7)] dark:border-[rgb(var(--color-gray-800)/0.5)] hover:border-[rgb(var(--color-primary)/0.4)] dark:hover:border-[rgb(var(--color-primary-light)/0.3)] transition-colors no-underline text-right ml-auto"><span class="text-xs text-[rgb(var(--color-gray-500))] dark:text-[rgb(var(--color-gray-400))]">Next →</span><span class="text-sm font-medium text-[rgb(var(--color-gray-700))] dark:text-[rgb(var(--color-gray-300))] group-hover:text-[rgb(var(--color-primary-ink))] dark:group-hover:text-[rgb(var(--color-primary-light))] transition-colors">Query</span></a></nav><div class="mt-16 mb-8 flex items-center justify-between border-t border-[rgb(var(--color-gray-200)/0.7)] dark:border-[rgb(var(--color-gray-800)/0.5)] pt-6 text-xs text-[rgb(var(--color-gray-500))] dark:text-[rgb(var(--color-gray-400))]"><a href="https://sourcey.com" target="_blank" rel="noopener noreferrer" class="flex items-center gap-1.5 hover:text-[rgb(var(--color-gray-600))] dark:hover:text-[rgb(var(--color-gray-300))] transition-colors">Built with<img src="https://sourcey.com/sourcey-logo.png" alt="Sourcey" class="h-4 w-4"/></a><div class="flex items-center gap-4"><a href="https://day.js.org" target="_blank" rel="noopener noreferrer" aria-label="day.js.org" class="hover:text-[rgb(var(--color-gray-600))] dark:hover:text-[rgb(var(--color-gray-300))] transition-colors">day.js.org</a><a href="https://github.com/iamkun/dayjs" target="_blank" rel="noopener noreferrer" aria-label="GitHub" class="hover:text-[rgb(var(--color-gray-600))] dark:hover:text-[rgb(var(--color-gray-300))] transition-colors">GitHub</a></div></div></div></div></main></div><div id="search-dialog" role="dialog" aria-label="Search"><div class="search-dialog-inner"><div class="search-input-row"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="search-input-icon"><path fill-rule="evenodd" d="M9 3.5a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11ZM2 9a7 7 0 1 1 12.452 4.391l3.328 3.329a.75.75 0 1 1-1.06 1.06l-3.329-3.328A7 7 0 0 1 2 9Z" clip-rule="evenodd"></path></svg><input id="search-input" type="text" placeholder="Search docs..." autocomplete="off" spellcheck="false"/></div><div id="search-results"></div><div class="search-footer"><span class="search-footer-hint"><kbd>↑↓</kbd> navigate</span><span class="search-footer-hint"><kbd>↵</kbd> select</span><span class="search-footer-hint"><kbd>esc</kbd> close</span></div></div></div></div><script src="../sourcey.js" defer></script></body></html>