← Level pieces 23D assetfogon/nivel-agua-profunda
Agua profunda
Drag to turn it// «Agua profunda» · gpt-6-sol (medium)
// A square ground tile that tiles seamlessly: a full 48x48 footprint (x 0..47, y 0..47), 8 blocks thick (z 0..7), a perfectly flat solid slab with straight vertical sides and no gaps. A deep water tile: the whole slab is water, deep navy blue at the bottom (z 0..3), medium blue in the middle, and a bright sky blue top (z 7) with small white foam ripples and lighter blue wave lines running across x. The top surface ripples.
// Solid, grid-aligned water slab: every column fills z 0–7.
const depthColors = [
"#103a7d", "#103a7d", "#16458b", "#16458b",
"#1b62b5", "#267bcc", "#318fdf"
];
for (let z = 0; z < 7; z++) {
box(0, 0, z, 47, 47, z, depthColors[z]);
}
part("olas", [24, 24, 7]);
for (let y = 0; y < 48; y++) {
for (let x = 0; x < 48; x++) {
// Four gently curving wave lines. The pattern matches at opposite edges.
const phase = 2 * Math.PI * (
4 * y / 47 + 0.19 * Math.sin(2 * Math.PI * x / 47)
);
const crest = Math.cos(phase);
const color = crest > 0.91 ? "#a8e2ff"
: crest > 0.72 ? "#6cc4ff"
: "#3aa0ff";
set(x, y, 7, color);
}
}
// Short white foam flecks stay well inside the tile edges.
for (const [x, y, length] of [
[8, 11, 4], [29, 10, 3], [17, 22, 5],
[35, 24, 3], [10, 35, 3], [27, 37, 4]
]) {
for (let i = 0; i < length; i++) set(x + i, y, 7, "#effaff");
set(x + 1, y + 1, 7, "#a8e2ff");
}
animate("olas", {
type: "colors",
palette: ["#3aa0ff", "#6cc4ff", "#a8e2ff"],
pattern: "wave",
glow: 0.2
});import { draw } from "./assets/voxel";
import { nivelAguaProfunda } from "./assets/nivel-agua-profunda";
// Every frame: standing on (x, y), the centre of its base.
draw(ctx, nivelAguaProfunda, x, y, { size: 64, angle: 0, t: performance.now() / 1000 });
// size: its longest side, in px
// angle: turn on the floor, in radians
// t: seconds; if it moves, that animates it# In a terminal, in the game's folder
fogon assets add nivel-agua-profunda
# With Fogón's tools (connector)
add_assets({ slug: "<your-game>", ids: ["nivel-agua-profunda"] })
# It lands in client/assets/nivel-agua-profunda.ts
# https://fogon.page/object/nivel-agua-profunda