Claude Sonnet 4.6 vs Mistral Medium 3
Compare Claude Sonnet 4.6 by Anthropic against Mistral Medium 3 by Mistral AI, context windows of 1.0M vs 131K, tested across 26 shared challenges. Updated February 2026.
Compare Claude Sonnet 4.6 by Anthropic against Mistral Medium 3 by Mistral AI, context windows of 1.0M vs 131K, tested across 26 shared challenges. Updated February 2026.
26 challenges
Tests an AI's randomness and creativity
Tests an AI's ability to generate vector graphics
Tests an AI's ability to create detailed SVG illustrations of gaming hardware
Tests an AI's humor and creative writing ability
Tests an AI's ability to simulate personalities and predict future trends
Tests an AI's humor and understanding of current events
Tests an AI's ability to generate a complete, working landing page
Recreate an interactive, nostalgic Pokémon battle UI in a single HTML file.
Recreate an interactive, classic Mario level in a single HTML file.
Couldn't render this response
This model didn't return a displayable web page for this challenge.
# Super Mario Bros. Interactive Level
Here's a self-contained HTML page that recreates a classic Super Mario Bros. level with interactive elements. It includes Mario's movement, jumping, coin collection, enemy interactions, and a simple physics system.
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Super Mario Bros. Level</title>
<style>
body {
margin: 0;
padding: 0;
overflow: hidden;
background-color: #6b8cff;
font-family: 'Press Start 2P', cursive;
user-select: none;
}
#game-container {
position: relative;
width: 100vw;
height: 100vh;
overflow: hidden;
}
#game-canvas {
background-color: #6b8cff;
display: block;
}
#hud {
position: absolute;
top: 10px;
left: 10px;
color: white;
font-size: 16px;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
background-color: rgba(0, 0, 0, 0.3);
padding: 5px 10px;
border-radius: 5px;
}
#start-screen {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.7);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
color: white;
text-align: center;
z-index: 10;
}
#start-screen h1 {
font-size: 48px;
margin-bottom: 20px;
text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.5);
}
#start-screen p {
font-size: 20px;
margin-bottom: 30px;
}
#start-button {
padding: 10px 20px;
font-size: 20px;
background-color: #ff0000;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
box-shadow: 0 0 10px rgba(255, 0, 0, 0.5);
transition: transform 0.2s;
}
#start-button:hover {
transform: scale(1.05);
}
#game-over-screen {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.7);
display: none;
flex-direction: column;
justify-content: center;
align-items: center;
color: white;
text-align: center;
z-index: 10;
}
#game-over-screen h1 {
font-size: 48px;
margin-bottom: 20px;
text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.5);
}
#game-over-screen p {
font-size: 20px;
margin-bottom: 30px;
}
#restart-button {
padding: 10px 20px;
font-size: 20px;
background-color: #ff0000;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
box-shadow: 0 0 10px rgba(255, 0, 0, 0.5);
transition: transform 0.2s;
}
#restart-button:hover {
transform: scale(1.05);
}
#win-screen {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.7);
display: none;
flex-direction: column;
justify-content: center;
align-items: center;
color: white;
text-align: center;
z-index: 10;
}
#win-screen h1 {
font-size: 48px;Tests an AI's ability to create interactive web elements
Tests an AI's ability to create a detailed world map in SVG format
Generate a single-page, self-contained HTML webapp using Tailwind CSS for a randomly chosen category/industry/niche.