Customize HTML5 games with Cerewro
Learn to customize any HTML5 game generated by Cerewro: swap sprites with your own images or AI-generated ones (DALL-E), add sound effects with the Web Audio API, apply your corporate color palette and add your brand logo.
Load custom images in Canvas
Custom sprite sheet usage
const playerImg = new Image();
playerImg.src = 'assets/my-character.png';
function drawPlayer(ctx, player, frame) {
const FW = 64, FH = 64;
ctx.drawImage(playerImg, frame*FW, 0, FW, FH, player.x, player.y, player.w, player.h);
}Generate sprites with AI (DALL-E from Cerewro)
Sprite generation prompt
Generate a pixel art character sprite 64x64 for a platformer game.
The character should be a cyberpunk robot with neon blue and purple colors,
transparent background, retro 16-bit style.
Create 4 variants: idle, run, jump, attack.8-bit sounds with Web Audio API
No external audio files needed
const audioCtx = new AudioContext();
function playSound(freq=440, type='square', duration=0.1, vol=0.3) {
const osc = audioCtx.createOscillator();
const gain = audioCtx.createGain();
osc.connect(gain); gain.connect(audioCtx.destination);
osc.type = type; osc.frequency.value = freq;
gain.gain.setValueAtTime(vol, audioCtx.currentTime);
gain.gain.exponentialRampToValueAtTime(0.001, audioCtx.currentTime + duration);
osc.start(); osc.stop(audioCtx.currentTime + duration);
}
const sounds = {
jump: () => playSound(300, 'square', 0.15),
collect: () => playSound(800, 'sine', 0.1),
hit: () => playSound(150, 'sawtooth', 0.2)
};
Full branding in 2 steps: 1) Ask Cerewro to generate sprites with your colors using DALL-E. 2) Ask it to modify the code to load those assets and adjust the HUD palette and effects. In under 5 minutes you have a game with your company's visual identity.