画面いっぱいに表示される時計

クラブ運営・セミナー中に、休憩時間を指定するちょうどよい時計が欲しくて作りました。タイトルのとおり、画面いっぱいに表示される時計です。

上は、キャプチャ画像です。移植すると全画面にならないので。できあがりの動いているのは、こちら。

生成AIをもちいた制作

なお、このプログラムはHTML・CSS・JSを生成AIをもちいて制作しました。

ほとんど修正なく、一発で合格レベルのプログラムができました。機能が少ないと一発で及第点のものが出力されます。デザイン面で修正を加えただけです。

ちなみに、書いたプロンプトは以下のような感じです。

1回目

javascriptで画面いっぱいの時計を作ってください。

2回目

以下のコードをベースに改良してください。
・左上に年月日を表示してください。フォーマットは、yyyy/mm/ddとします。大きさは、時刻の20%ほどにしてください。
・時分秒のうち、秒を右下に小さく表示してください。そのさい、分と秒の間の：（コロン）は不要です。

～コード省略～

3回目

以下のコードをベースに改良してください。
・時分の文字を縦長にしてください。縦150%、横100%

～コード省略～