HTMLとCSSだけでMinecraftを再現

「100%純粋なHTMLとCSS」で作成された「マインクラフト」のページが公開されています。
CSS Minecraft
https://benjaminaster.com/css-minecraft/
上記のページにアクセスすると以下の画面が現れます。

用意されているブロックは全部で7種類。左下から選んでフィールドをクリックすると設置できます。


右下のボタンをクリックするとフィールドの位置を変えられます。「Vertical」で垂直方向への視点移動、「Horizontal」で水平方向への視点移動、「Rotation」でフィールドの回転、「View」で視点の上下移動ができます。

左下のツルハシをクリックしてからブロックをクリックすると、ブロックを削除できます。


ブロックを設置できるのは9×9×9マスの間のみ。

最初からあるブロックを横に伸ばすことはできませんが、削ったり、新しいブロックに置き換えたりすることができます。

Z軸方向にも9マスの制限があります。

置いたブロックを削ってブロックを浮かせることも可能です。

このマインクラフトは、480行のCSSと4万6022行(3.07MB)のHTMLで実装されているとのことです。
CSS Minecraft
https://simonwillison.net/2025/May/26/css-minecraft/
本家マインクラフトは以下から購入できます。
Amazon.co.jp: Minecraft (マインクラフト) - Switch : ゲーム

Amazon.co.jp: Minecraft - PS5 : ゲーム

・関連記事
GoogleがAIアルゴリズムの「DreamerV3」を開発、「人間のデータなしでマインクラフトのダイヤモンドを採掘できる最初のAI」 - GIGAZINE
マインクラフトで忠実に再現した細胞内を冒険できるプロジェクト「CraftCells」 - GIGAZINE
「マインクラフト」で最大1000人のAIエージェントが共同生活する社会実験で宗教や文化的ミームが広まったと判明 - GIGAZINE
あの「マインクラフト」が現実世界にテーマパークを開業、2026年~2027年にオープン予定 - GIGAZINE
・関連コンテンツ
in ゲーム, Posted by log1p_kr
You can read the machine translated English article Recreate Minecraft using only HTML and C….