1<!DOCTYPE html>
2<html lang="en">
3 <!--
4 ___ _____ _
5 / _ \ _ _|_ _|_ _| | _____
6 | | | | '_ \| |/ _` | |/ / _ \
7 | |_| | | | | | (_| | < __/
8 \___/|_| |_|_|\__,_|_|\_\___|
9
10 Copyright 2026. Louis Dalibard
11 -->
12
13 <head>
14 <!-- Stylesheet-->
15 <link
16 rel="stylesheet"
17 type="text/css"
18 href="style.css"
19 />
20 <!-- Title Element-->
21 <title>home | ontake.dev</title>
22 <!-- Icon-->
23 <link rel="icon" type="image/webp" href="/assets/images/icon.png" />
24 <!-- Metadata-->
25 <meta property="og:type" content="website" />
26 <meta property="og:url" content="https://ontake.dev" />
27 <meta property="og:title" content="home | ontake.dev" />
28 <meta name="viewport" content="width=device-width, initial-scale=0.1" />
29 <!-- Scripts-->
30 <script src="/assets/js/draggable.js"></script>
31 </head>
32
33 <body>
34 <div id="content" class="content-main">
35 <div class="window">
36 <div class="window-decorations">
37 <div class="window-title">cd-pfp.png</div>
38 <div class="window-decorations-spacer-container">
39 <div class="window-decorations-spacer"></div>
40 <div class="window-decorations-spacer"></div>
41 <div class="window-decorations-spacer"></div>
42 </div>
43 <div class="window-button">_</div>
44 <div class="window-button">☐</div>
45 <div class="window-button window-button-close">⨯</div>
46 </div>
47 <img id="profile-pic" src="assets/images/pfp-cd-crop.png"></img>
48 </div>
49 <div id="right">
50 Hello! Welcome to my website.<br />
51 こんにちは！ 私のウェブサイトへようこそ。
52 <br /><br />
53 Enjoy your stay here and have a look around. There are plenty of things
54 to see.<br />
55 ここでの滞在を楽しんで、周りを見てください。
56 見どころはたくさんあります。
57 <br /><br /><br />
58 『Listening to<br />
59 breakcore and the sound of rain outside<br />
60 on a warm and humid summer night.<br />
61 ブレイクコアを聴きながら<br />
62 そして外は雨の音<br />
63 蒸し暑い夏の夜に。』
64 </div>
65 <div id="chris-chan">
66 This is Chris. ⤳<br />
67 これはクリスちゃん。 ⤳
68 </div>
69 <div class="window right-justified" id="chicken-microwave">
70 <div class="window-decorations">
71 <div class="window-title">ch.gif</div>
72 <!-- No spacer because not big enough -->
73 <div class="window-button">_</div>
74 <div class="window-button">☐</div>
75 <div class="window-button window-button-close">⨯</div>
76 </div>
77 <img
78 src="assets/gif/chicken-microwave-2x.gif"
79 id="chicken-microwave-inner"
80 style="image-rendering: pixelated;"
81 />
82 </div>
83
84 <div id="counter-container">
85 Total visits | 総訪問数<br />
86 <iframe class="counter" src="https://counter.ontake.dev/"></iframe>
87 </div>
88 <!-- <div id="counter-container-chart">
89 Total visits / Date | 総訪問数 / 日付<br />
90 <img id="counter-chart" src="https://counter.ontake.dev/chart" style="image-rendering: pixelated;" />
91 </div> -->
92 <div id="counter-container-reloads">
93 Total reloads | 総リロード数<br />
94 <iframe
95 class="counter"
96 src="https://counter.ontake.dev/reloads"
97 ></iframe>
98 </div>
99
100 <div class="window" id="now-playing-window">
101
102 <div class="window-decorations" style="cursor: grab;">
103 <div class="window-title">now_playing.flac</div>
104
105 <div class="window-decorations-spacer-container">
106 <div class="window-decorations-spacer"></div>
107 <div class="window-decorations-spacer"></div>
108 <div class="window-decorations-spacer"></div>
109 </div>
110
111 <div class="window-button">_</div>
112 <div class="window-button">☐</div>
113 <div class="window-button window-button-close">⨯</div>
114 </div>
115
116
117 <iframe height="640px" style="border: none;" src="https://utils.ontake.dev/listenbrainz/now_playing" width="1000px"></iframe>
118
119 </div>
120
121 <div class="window" id="caffeine-window">
122
123 <div class="window-decorations" style="cursor: grab;">
124 <div class="window-title">caffeine.graph</div>
125
126 <div class="window-decorations-spacer-container">
127 <div class="window-decorations-spacer"></div>
128 <div class="window-decorations-spacer"></div>
129 <div class="window-decorations-spacer"></div>
130 </div>
131
132 <div class="window-button">_</div>
133 <div class="window-button">☐</div>
134 <div class="window-button window-button-close">⨯</div>
135 </div>
136
137
138 <div class="graph-container">
139
140 <div class="graph-legend">
141 <span>
142 <i class="legend-blood"></i>
143 bloodstream
144 </span>
145
146 <span>
147 <i class="legend-intake"></i>
148 intake
149 </span>
150 </div>
151
152 <div class="graph-frame">
153
154 <div id="mass-axis">
155 <div class="mass-label" style="bottom:0">0 mg</div>
156 <div class="mass-label" style="bottom:10%">100 mg</div>
157 <div class="mass-label" style="bottom:20%">200 mg</div>
158 <div class="mass-label" style="bottom:30%">300 mg</div>
159 <div class="mass-label" style="bottom:40%">400 mg</div>
160 <div class="mass-label" style="bottom:50%">500 mg</div>
161 <div class="mass-label" style="bottom:60%">600 mg</div>
162 <div class="mass-label" style="bottom:70%">700 mg</div>
163 <div class="mass-label" style="bottom:80%">800 mg</div>
164 <div class="mass-label" style="bottom:90%">900 mg</div>
165 <div class="mass-label" style="bottom:100%">1000 mg</div>
166 </div>
167
168
169 <div id="graph-scroll">
170 <div id="graph-area">
171 <div id="graph-track"></div>
172 <div id="time-axis"></div>
173 </div>
174 </div>
175
176 </div>
177
178 </div>
179
180 </div>
181 <script src="/assets/js/caffeine.js"></script>
182
183 <div id="footer">
184 Come talk on Matrix at: #chat@matrix.ontake.dev<br /><br /><br />
185 © 2021-2026 ontake.dev<br />
186 last updated on 2026/07/23<br /><br />
187 <a href="https://ontake.dev/"
188 ><img id="eightyeightbythirtyone" src="assets/88x31/88x31.gif" style="image-rendering: pixelated;"
189 /></a>
190 <br /><br />
191 <a href="https://dms.ontake.dev/"
192 ><img id="tombstone" src="https://dms.ontake.dev/tombstone.png" style="image-rendering: pixelated;"
193 /></a>
194 <br />
195 <br />
196 </div>
197 </div>
198 <div id="topbar">
199<img src="/assets/images/logo-no-bg.png" id="topbar-logo" height="51.2px">
200 <a class="topbar-link" href="/">home</a>
201 <a class="topbar-link" href="/about/">about</a>
202 <a class="topbar-link" href="/gallery/">gallery</a>
203 <a class="topbar-link" href="/projects/">projects</a>
204 <a class="topbar-link" href="/guestbook/">guestbook</a>
205 <a class="topbar-link" href="/ascii/">ascii</a>
206 <a class="topbar-link" href="/experiments/">experiments</a>
207 <a class="topbar-link" href="/garden/">garden</a>
208 <a class="topbar-link" href="/mixes/">mixes</a>
209 <a class="topbar-link" href="https://leech.ontake.dev">leech</a>
210 </div>
211 </body>
212</html>