Skip to content

Arcade › Tetris

Tetris

  • 2d
  • puzzle
  • arcade
  • tetris
  • grid-based
0
Remix it Discord

7 plays

How to play

Click the game above and it runs right here in your browser. No download, no installer, no account needed. Oleg Sidorkin built it with Cinevva, so it works on a phone or a tablet too.

Discussion

Nobody has said anything about Tetris yet. Play it, then tell Oleg Sidorkin what you would add next.

Make your own game

Tetris was built by Oleg Sidorkin with the Cinevva game creator: describe the game you want in chat, watch it get built, and play it in your browser minutes later.

Remix Tetris opens the real game in the creator and forks its actual files, chat and design doc, so you start from the code rather than from a description.

Read the build brief for Tetris

Cinevva's analyzer read this game's design doc and its source, then wrote the brief below. "Make your own" hands it to the game creator as your opening message, so you start from a real spec rather than a one-line idea.

Create a browser-based 2D Tetris game titled “TETRIS” with a stark, minimalist dark arcade presentation. Use a centered vertical page with a black/dark charcoal (#0a0a0a) background, white Segoe UI/Arial text, and a cyan title with wide letter spacing. The main layout is a 10-column by 20-row playfield on the left and a statistics panel on the right, aligned at the top with a gap between them.

The playfield must be a 200x400 canvas, so each cell is exactly 20x20 pixels. Give it a dark #111 background, a thick dark-gray border, and a subtle cyan-tinted shadow. Draw thin dark-gray grid lines for all cell boundaries. Falling and locked tetromino blocks are crisp, flat-color squares with a thin darker outline; there are no gradients, textures, or 3D effects. Implement the standard seven tetromino types with these exact colors: I cyan (#00f0f0), O yellow (#f0f000), T purple (#a000f0), S green (#00f000), Z red (#f00000), J blue (#0000f0), and L orange (#f0a000). Spawn pieces near the top center of the board. The initial piece is random, and after each piece is used, generate one random upcoming piece.

Implement standard falling-block gameplay on a 10x20 matrix. Pieces fall automatically, initially once per 1000 ms. The player can move left and right, soft drop downward, rotate, and hard drop. Use the exact keyboard controls: Left/Right arrows move horizontally, Down arrow soft-drops, Up arrow rotates clockwise, Space instantly drops the current piece to the lowest valid position and locks it, and P toggles pause. Arrow keys should also support held-key repeat: horizontal movement repeats about every 140 ms and held Down repeats about every 45 ms. A blocked downward move locks the current piece into the board. Rotation cycles through the predefined rotations for each shape and uses a simple wall kick, trying the current position, then one cell left, then one cell right; cancel the rotation if none are valid. Do not allow movement through walls, below the floor, or through occupied cells.

Render a ghost/landing preview for the current piece at its lowest valid Y position, using the same piece color at roughly 25% opacity, but only draw it when it is below the current piece. Then draw the active piece normally on top. Completed rows are detected and removed, with rows above shifting downward and empty rows inserted at the top. Scoring must match the implementation: clearing 1/2/3/4 lines awards 40/100/300/1200 points multiplied by the current level; hard-drop movement awards one point per cell traveled. Track total lines cleared. Start at level 1, and increase to floor(lines cleared / 10) + 1. Recalculate automatic drop speed at each level as max(80 ms, 1000 - (level - 1) * 90 ms).

To the right, make a dark #1a1a1a information panel about 140px wide with 15px padding and a thin dark-gray border. Show three stacked labels in white uppercase text: SCORE, LINES, and LEVEL, each followed by its value in large bold cyan text. Under them, show a muted gray NEXT label and an 80x80 dark preview canvas with a dark-gray border. Center the next tetromino in that preview using 16px blocks and its normal color. The screenshot’s visual state should resemble a yellow O piece near the top of the left grid, with a blue L/J-like piece displayed in NEXT, while actual gameplay remains randomly generated.

Below the board/panel, show a muted-gray controls hint centered on the page: “← → Move | ↓ Soft Drop | ↑ Rotate | SPACE Hard Drop | P Pause”. Put a dark button below it labeled START, with white text, dark background, dark-gray border, generous horizontal padding, and a hover state that lightens the background and changes the border to cyan. Before the first game begins, the board is empty and displays “Click START” in muted gray centered in the playfield. Clicking START begins or restarts a game, resets score, lines, level, speed, and the board, and changes the button to PAUSE. Clicking it during play pauses; the button then says RESUME and a translucent black overlay with centered white “PAUSED” appears over the board. Resuming removes the overlay and continues play. When a new piece cannot spawn because its starting cells collide, end the game, play a translucent black overlay over the board with centered red bold “GAME OVER” and white “Click START to play again”, and change the button text to RESTART.

Add lightweight audio feedback if supported: short interface click sounds for movement and rotation, a drop sound when locking or hard-dropping, a sound when clearing lines, and a game-over impact sound. Start looping background music at low volume when gameplay starts, pause it while paused, and reset it when restarting. Keep the overall presentation clean, grid-based, and faithful to the supplied screenshot: dark nearly black background, narrow tall playfield, compact right HUD, cyan numeric accents, and vivid primary-colored tetrominoes.

More free browser games

Browse the whole Arcade →