Latest developments on AI fashions have been particularly targeted on one activity – coding brokers. Following the road, Alibaba’s Qwen is now out with a brand new mannequin, one which guarantees industry-leading outcomes, all whereas working regionally. This primarily makes it an open-weight language mannequin designed, within the phrases of the Qwen group, “particularly for coding brokers and native improvement.” As for the moniker, Alibaba’s AI division has conveniently termed the brand new mannequin Qwen3-Coder-Subsequent.
So what makes the brand new mannequin totally different? Sharing a touch at this in a weblog, the group at Qwen particularly mentions that the Qwen3-Coder-Subsequent has been “agentically skilled at scale on large-scale executable activity synthesis, setting interplay, and reinforcement studying.” Due to this coaching, the Qwen3-Coder-Subsequent is alleged to return with “robust coding and agentic capabilities,” all whereas incurring a “considerably decrease inference prices.”
Simply how a lot enchancment is that this within the real-world use circumstances? Let’s discover out on this article.
What’s Qwen3-Coder-Subsequent?
As talked about, Qwen3-Coder-Subsequent is an open-weight language mannequin, which implies its skilled parameters (weights) are launched publicly, and anybody can obtain, run, and fine-tune it regionally (learn extra about open-weight fashions right here). At its core, Qwen3-Coder-Subsequent is constructed to behave much less like a chatbot and extra like an actual software program agent. As an alternative of simply predicting the subsequent line of code, it’s skilled to grasp your objectives, work together with execution environments, and iterate towards working options. Whereas it could not sound a lot to you, this distinction issues loads.
A serious spotlight with the mannequin is that it’s purpose-built for agentic workflows. This implies Qwen3-Coder-Subsequent can plan multi-step duties, purpose over lengthy recordsdata, run code, observe outputs, and modify its method. To consider it, that is precisely how human builders really work.
One more key level is deployment. Qwen3-Coder-Subsequent is designed to run regionally, giving builders full management over their setting, knowledge, and workflows. That makes it particularly engaging for groups engaged on proprietary codebases, inside tooling, or offline setups, with out sacrificing functionality.
In brief, this isn’t only a “write me a operate” mannequin. Qwen3-Coder-Subsequent is Qwen’s try to show AI right into a sensible, regionally runnable coding agent. One that may assume, take a look at, and enhance its personal output.
Qwen3-Coder-Subsequent Structure
In its weblog, the Qwen group specifies that the Qwen3-Coder-Subsequent has been “constructed on high of Qwen3-Subsequent-80B-A3B-Base.” This implies it inherits the identical hybrid consideration and MoE (Combination of Consultants) structure that powers Qwen’s newest era of enormous fashions.
This hybrid consideration design is among the many finest strategies for balancing long-context understanding with environment friendly computation. Which implies, as a substitute of making use of full consideration in all places, it selectively allocates consideration the place it issues most. That is particularly essential for coding duties, the place the mannequin should purpose throughout massive recordsdata, dependencies, and execution logs with out blowing up reminiscence or latency.
The MoE setup additional sharpens this effectivity. Quite than activating the whole mannequin for each token, Qwen3-Coder-Subsequent dynamically routes duties to a small subset of specialised “specialists.” In apply, this implies you get the advantages of a really massive mannequin, however you solely pay the compute value of a a lot smaller one throughout inference.
Now let’s revert to the 2 core competencies of Qwen3-Coder-Subsequent. The mannequin can help agentic coding workflows at scale, whereas nonetheless being sensible sufficient to run regionally. It’s clear that that is attainable solely by way of these architectural selections.
Now that we all know how its constructed, let’s try its efficiency on benchmark scores.
Qwen3-Coder-Subsequent Benchmark Efficiency
Primarily based on the official benchmarks (learn extra about AI benchmarks right here) shared by the Qwen group, right here is how Qwen3-Coder-Subsequent performs throughout broadly used coding agent evaluations:
- SWE-Bench Verified (with SWE-Agent): 70.6% success charge
- SWE-Bench Multilingual (with SWE-Agent): 62.8% success charge
- SWE-Bench Professional (with SWE-Agent): 44.3% success charge
- Terminal-Bench 2.0 (with Terminus-2 JSON): 36.2% success charge
- Aider benchmark: 66.2% success charge
What These Scores Inform Us
The standout efficiency on SWE-Bench Verified proves that Qwen3-Coder-Subsequent is extremely efficient at real-world software program upkeep duties, particularly these involving bug fixing and repository-level reasoning. This benchmark intently mirrors what builders face in manufacturing codebases, making this end result significantly significant.
Its robust displaying on SWE-Bench Multilingual highlights one other key power: the mannequin is just not restricted to English-only code contexts. It could possibly purpose throughout multilingual repositories, feedback, and documentation, and never drop its consistency. That is an more and more essential requirement for world improvement groups.
The SWE-Bench Professional rating additional reinforces that this mannequin is constructed for agentic depth, whereas Terminal-Bench 2.0 outcomes point out dependable command-line reasoning and structured instrument interplay. Lastly, the robust efficiency on Aider, a benchmark targeted on AI-assisted coding workflows, reveals that Qwen3-Coder-Subsequent integrates nicely into actual developer tooling.
If we had been to summarise this benchmark efficiency, it’s clear that the brand new Qwen mannequin is optimized for sensible coding brokers. Its efficiency persistently displays the power to plan, act, observe, and iterate. And that is precisely what trendy AI-powered improvement workflows demand.
Qwen3-Coder-Subsequent: Entry
There are 3 methods you may entry the brand new Qwen3-Coder-Subsequent, based mostly on the platform you need it on –
HuggingFace – https://huggingface.co/collections/Qwen/qwen3-coder-next
Kaggle – https://www.kaggle.com/fashions/qwen-lm/qwen3-coder-next
ModelScope – https://modelscope.cn/collections/Qwen/Qwen3-Coder-Subsequent
Fingers-on with Qwen3-Coder-Subsequent
To check out the prowess of the newest Qwen mannequin, we put it by way of some real-world exams. We shared the next prompts with it to take a look at the outputs, and here’s what we received.
1. A Recreation of Snake
Immediate:
Create a easy snake sport. embody bonus factors in between that develop the snake by 3 factors as a substitute of 1
Output:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta identify="viewport" content material="width=device-width, initial-scale=1.0">
<title>Snake Recreation - Bonus Mode</title>
<model>
physique {
background-color: #222;
colour: white;
font-family: 'Courier New', Courier, monospace;
show: flex;
flex-direction: column;
align-items: heart;
justify-content: heart;
top: 100vh;
margin: 0;
}
h1 { margin-bottom: 10px; }
.score-board {
show: flex;
hole: 20px;
margin-bottom: 10px;
font-size: 1.2rem;
}
canvas {
border: 4px strong #fff;
background-color: #000;
box-shadow: 0 0 20px rgba(0,0,0,0.5);
}
.controls {
margin-top: 15px;
font-size: 0.9rem;
colour: #aaa;
}
/* Legend for the meals varieties */
.legend {
show: flex;
hole: 15px;
margin-top: 10px;
font-size: 0.8rem;
}
.dot { width: 10px; top: 10px; show: inline-block; margin-right: 5px; }
</model>
</head>
<physique>
<h1>Snake Recreation</h1>
<div class="score-board">
<div id="rating">Rating: 0</div>
<div id="highScore">Excessive Rating: 0</div>
</div>
<canvas id="gameCanvas" width="400" top="400"></canvas>
<div class="legend">
<span><span class="dot" model="background:lime;"></span>Regular (+1)</span>
<span><span class="dot" model="background:cyan; border: 1px dashed white;"></span>Bonus (+3)</span>
</div>
<div class="controls">
Use <robust>Arrow Keys</robust> to maneuver
</div>
<script>
const canvas = doc.getElementById('gameCanvas');
const ctx = canvas.getContext('2nd');
// Recreation Settings
const gridSize = 20;
const tileCount = canvas.width / gridSize;
let velocity = 7; // Frames per second (increased is quicker)
// Recreation State
let rating = 0;
let highScore = localStorage.getItem('snakeHighScore') || 0;
doc.getElementById('highScore').innerText = `Excessive Rating: ${highScore}`;
let velocityX = 0;
let velocityY = 0;
let snake = [];
let snakeLength = 3; // Preliminary size
let tail = [];
// Meals State
let foodX = 5;
let foodY = 5;
let isBonusFood = false; // False = regular, True = bonus
let bonusTimer = 0; // To make bonus meals disappear after some time
// Initialize Recreation
operate resetGame() {
snake = [];
snakeLength = 3;
rating = 0;
doc.getElementById('rating').innerText = `Rating: ${rating}`;
// Begin within the center
let startX = 10;
let startY = 10;
for(let i = 0; i < snakeLength; i++) {
snake.push({x: startX - i, y: startY});
}
// Begin shifting proper
velocityX = 1;
velocityY = 0;
placeFood();
}
// Essential Recreation Loop
operate gameLoop() {
replace();
draw();
setTimeout(gameLoop, 1000 / velocity);
}
operate replace() {
// Calculate new head place
let headX = snake[0].x + velocityX;
let headY = snake[0].y + velocityY;
// 1. Examine Wall Collision (Recreation Over)
if (headX < 0 || headX >= tileCount || headY < 0 || headY >= tileCount) {
resetGame();
return;
}
// 2. Examine Self Collision (Recreation Over)
for (let i = 0; i < snake.size; i++) {
if (snake[i].x === headX && snake[i].y === headY) {
resetGame();
return;
}
}
// Add new head
snake.unshift({x: headX, y: headY});
// 3. Examine Meals Collision
if (headX === foodX && headY === foodY) {
// Decide development quantity based mostly on meals sort
let growthAmount = isBonusFood ? 3 : 1;
// Add additional segments to the tail logic
snakeLength += growthAmount;
// Replace Rating
rating += isBonusFood ? 50 : 10;
doc.getElementById('rating').innerText = `Rating: ${rating}`;
// If it was a bonus, guarantee it is handled as consumed
isBonusFood = false;
// 20% likelihood to spawn a bonus meals, 80% regular
// Solely spawn bonus if present meals wasn't already a bonus
if (Math.random() > 0.8) {
isBonusFood = true;
bonusTimer = 30; // Lasts for approx 30 frames (4-5 seconds)
} else {
isBonusFood = false;
}
placeFood();
}
// Take away outdated tail segments to take care of size
whereas (snake.size > snakeLength) {
snake.pop();
}
// Deal with Bonus Meals Timer (Disappears if not eaten)
if (isBonusFood) {
bonusTimer--;
if (bonusTimer <= 0) {
isBonusFood = false;
placeFood(); // Substitute it with regular meals
}
}
}
operate draw() {
// Clear Display
ctx.fillStyle="black";
ctx.fillRect(0, 0, canvas.width, canvas.top);
// Draw Snake
ctx.fillStyle="lime";
for (let i = 0; i < snake.size; i++) {
// Make head a barely totally different colour
if (i === 0) {
ctx.fillStyle="#CCFFCC";
} else {
ctx.fillStyle="lime";
}
ctx.fillRect(snake[i].x * gridSize, snake[i].y * gridSize, gridSize - 2, gridSize - 2);
}
// Draw Meals
if (isBonusFood) {
// Bonus Meals: Cyan, Glowing look
ctx.shadowBlur = 15;
ctx.shadowColor = "cyan";
ctx.fillStyle="cyan";
ctx.font = "20px Arial";
ctx.textAlign = "heart";
ctx.textBaseline = "center";
// Draw a lightning bolt image
ctx.fillText("⚡", (foodX * gridSize) + (gridSize/2), (foodY * gridSize) + (gridSize/2) + 2);
ctx.shadowBlur = 0; // Reset shadow for different parts
} else {
// Regular Meals: Pink
ctx.fillStyle="purple";
ctx.fillRect(foodX * gridSize, foodY * gridSize, gridSize - 2, gridSize - 2);
}
}
operate placeFood() {
// Random place
foodX = Math.flooring(Math.random() * tileCount);
foodY = Math.flooring(Math.random() * tileCount);
// Do not place meals on snake physique
for (let a part of snake) {
if (half.x === foodX && half.y === foodY) {
placeFood(); // Strive once more
return;
}
}
}
// Controls
doc.addEventListener('keydown', keyDownEvent);
operate keyDownEvent(e) {
// Arrow keys logic (stop reversing course)
swap (e.keyCode) {
case 37: // Left
if (velocityX !== 1) { velocityX = -1; velocityY = 0; }
break;
case 38: // Up
if (velocityY !== 1) { velocityX = 0; velocityY = -1; }
break;
case 39: // Proper
if (velocityX !== -1) { velocityX = 1; velocityY = 0; }
break;
case 40: // Down
if (velocityY !== -1) { velocityX = 0; velocityY = 1; }
break;
}
}
// Begin the sport
resetGame();
gameLoop();
</script>
</physique>
</html>
Qwen3-Coder-Subsequent was capable of generate this complete code inside a break up second. And having examined it out, I’ve discovered it to be working completely, even with the particular instruction of bonus factors that develop the snake disproportionately. Go forward, strive a immediate like this and you may be amazed on the velocity and accuracy of the mannequin.
2. HTML Code for Easy Animation
Immediate:
Give me an HTML code for a circle rotating inside a sq., which is inside a triangle. The ball and triangle are rotating in a single course and sq. within the reverse.
Output:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta identify="viewport" content material="width=device-width, initial-scale=1.0">
<title>Rotating Geometric Shapes</title>
<model>
physique {
background-color: #1a1a1a;
show: flex;
justify-content: heart;
align-items: heart;
top: 100vh;
margin: 0;
overflow: hidden;
}
/* --- SHARED STYLES --- */
.form {
show: flex;
justify-content: heart;
align-items: heart;
place: relative;
}
/* --- THE TRIANGLE (Outer Layer) --- */
/* We create a triangle utilizing the border trick */
.triangle {
width: 0;
top: 0;
border-left: 200px strong clear;
border-right: 200px strong clear;
border-bottom: 346px strong #ff4757; /* Pink Triangle */
/* Animation: Spin 10 seconds clockwise */
animation: spin 10s linear infinite;
}
/* --- THE SQUARE (Center Layer) --- */
.sq. {
width: 200px;
top: 200px;
background-color: #2ed573; /* Inexperienced Sq. */
/* Positioning: Centered inside the triangle */
place: absolute;
high: 73px; /* (346px top - 200px sq.) / 2 roughly adjusted for visible heart */
left: -100px; /* Heart the 200px width */
/* Animation: Spin 5 seconds Counter-Clockwise (Other way) */
animation: spin-reverse 5s linear infinite;
/* Maintain youngsters centered */
show: flex;
justify-content: heart;
align-items: heart;
}
/* --- THE CIRCLE (Internal Layer) --- */
.circle {
width: 80px;
top: 80px;
background-color: #1e90ff; /* Blue Circle */
border-radius: 50%;
/* Animation: Spin 2 seconds Clockwise */
animation: spin 2s linear infinite;
}
/* --- ANIMATIONS --- */
/* Clockwise Rotation */
@keyframes spin {
0% { remodel: rotate(0deg); }
100% { remodel: rotate(360deg); }
}
/* Counter-Clockwise Rotation */
@keyframes spin-reverse {
0% { remodel: rotate(0deg); }
100% { remodel: rotate(-360deg); }
}
/* Optionally available: Add a white define to make the shapes pop */
.triangle::after {
content material: '';
place: absolute;
border-left: 200px strong clear;
border-right: 200px strong clear;
border-bottom: 346px strong rgba(255, 255, 255, 0.2); /* Faint define */
pointer-events: none;
}
</model>
</head>
<physique>
<!-- Layer 1: The Triangle -->
<div class="form triangle">
<!-- Layer 2: The Sq. -->
<div class="form sq.">
<!-- Layer 3: The Circle -->
<div class="form circle"></div>
</div>
</div>
</physique>
</html>
But once more, Qwen3-Coder-Subsequent got here up with a code for the duty at hand at lightning velocity. It precisely depicts the shapes and their rotation. The one little change I’d’ve wished right here was for the shapes to be fully contained in the outer one, versus the half-in, half-out association as proven right here. Aside from that, the AI mannequin did it brilliantly nicely.
3. Fundamental HTML Web site
Immediate:
Construct a fundamental HTML web site for a tourism firm, itemizing packages for the favored vacationer locations in India. Add one other class displaying journey actions as packages. Preserve a header with a emblem and the everyday menu of a web site. Maintain the color theme blue and white.
Output:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta identify="viewport" content material="width=device-width, initial-scale=1.0">
<title>India Travels | Discover the Pink & Blue Nation</title>
<model>
/* --- CSS VARIABLES FOR THEME --- */
:root {
--primary-blue: #0056b3;
--dark-blue: #003d80;
--light-blue: #e3f2fd;
--white: #ffffff;
--text-dark: #333333;
--text-light: #666666;
--accent-gold: #ffb700; /* For icons/ornament */
}
/* --- GLOBAL STYLES --- */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
html {
scroll-behavior: clean;
}
physique {
colour: var(--text-dark);
line-height: 1.6;
background-color: #f9f9f9;
}
a { text-decoration: none; colour: inherit; }
ul { list-style: none; }
/* --- HEADER & NAVIGATION --- */
header {
background-color: var(--white);
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
place: sticky;
high: 0;
z-index: 1000;
}
.navbar {
max-width: 1200px;
margin: 0 auto;
padding: 1rem;
show: flex;
justify-content: space-between;
align-items: heart;
}
.emblem {
font-size: 1.8rem;
font-weight: 800;
colour: var(--primary-blue);
show: flex;
align-items: heart;
hole: 10px;
}
.emblem span {
colour: var(--white);
background-color: var(--primary-blue);
padding: 2px 8px;
border-radius: 4px;
}
.nav-links {
show: flex;
hole: 30px;
}
.nav-links a {
font-weight: 600;
colour: var(--text-dark);
transition: colour 0.3s;
}
.nav-links a:hover {
colour: var(--primary-blue);
}
.cta-btn {
background-color: var(--primary-blue);
colour: var(--white);
padding: 10px 25px;
border-radius: 25px;
font-weight: 700;
transition: background 0.3s;
}
.cta-btn:hover {
background-color: var(--dark-blue);
}
/* Cell Menu Toggle (Hidden on Desktop) */
.menu-toggle { show: none; font-size: 1.5rem; cursor: pointer; }
/* --- HERO SECTION --- */
.hero {
background: linear-gradient(rgba(0, 60, 128, 0.6), rgba(0, 60, 128, 0.6)),
url('https://photos.unsplash.com/photo-1535448210370-477065325eca?auto=format&match=crop&w=1920&q=80');
background-size: cowl;
background-position: heart;
top: 60vh;
show: flex;
flex-direction: column;
justify-content: heart;
align-items: heart;
text-align: heart;
colour: var(--white);
padding: 0 20px;
}
.hero h1 { font-size: 3.5rem; margin-bottom: 20px; line-height: 1.2; }
.hero p { font-size: 1.2rem; max-width: 600px; margin-bottom: 30px; }
/* --- SECTIONS GENERAL --- */
.section-container {
max-width: 1200px;
margin: 0 auto;
padding: 60px 20px;
}
.section-header {
text-align: heart;
margin-bottom: 50px;
}
.section-header h2 {
colour: var(--primary-blue);
font-size: 2.5rem;
margin-bottom: 10px;
}
.section-header hr {
width: 60px;
top: 3px;
background-color: var(--accent-gold);
margin: 0 auto;
border: none;
}
/* --- PACKAGES GRID LAYOUT --- */
.packages-grid {
show: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
hole: 40px;
}
.package-card {
background: var(--white);
border-radius: 10px;
overflow: hidden;
box-shadow: 0 5px 15px rgba(0,0,0,0.08);
transition: remodel 0.3s ease;
}
.package-card:hover {
remodel: translateY(-10px);
}
.card-image {
top: 200px;
width: 100%;
object-fit: cowl;
}
.card-content {
padding: 25px;
}
.card-tag {
font-size: 0.8rem;
background-color: var(--light-blue);
colour: var(--primary-blue);
padding: 4px 10px;
border-radius: 15px;
text-transform: uppercase;
font-weight: 700;
show: inline-block;
margin-bottom: 15px;
}
.card-title {
font-size: 1.5rem;
colour: var(--dark-blue);
margin-bottom: 10px;
}
.card-desc {
colour: var(--text-light);
margin-bottom: 20px;
font-size: 0.95rem;
}
.card-features {
show: flex;
hole: 15px;
margin-bottom: 20px;
font-size: 0.9rem;
colour: var(--text-dark);
border-top: 1px strong #eee;
padding-top: 15px;
}
.feature-item span {
colour: var(--primary-blue);
font-weight: daring;
margin-right: 5px;
}
.price-tag {
font-size: 1.5rem;
font-weight: 800;
colour: var(--text-dark);
float: left;
}
.book-btn {
float: proper;
background-color: var(--white);
border: 2px strong var(--primary-blue);
colour: var(--primary-blue);
padding: 10px 25px;
border-radius: 5px;
font-weight: 700;
transition: 0.3s;
cursor: pointer;
}
.book-btn:hover {
background-color: var(--primary-blue);
colour: var(--white);
}
/* --- ADVENTURE SECTION STYLING --- */
#journey {
background-color: var(--light-blue);
}
.adventure-icon {
font-size: 2rem;
colour: var(--accent-gold);
margin-bottom: 10px;
}
/* --- CONTACT FORM SECTION --- */
.contact-section {
background-color: var(--white);
text-align: heart;
}
.contact-container {
max-width: 600px;
margin: 0 auto;
background: var(--white);
padding: 40px;
border-radius: 10px;
box-shadow: 0 0 20px rgba(0,0,0,0.05);
border: 1px strong #e0e0e0;
}
kind {
show: flex;
flex-direction: column;
hole: 15px;
margin-top: 30px;
}
enter, textarea {
padding: 15px;
border: 1px strong #ccc;
border-radius: 5px;
font-size: 1rem;
}
textarea { top: 150px; resize: vertical; }
.submit-btn {
background-color: var(--primary-blue);
colour: var(--white);
border: none;
padding: 15px;
font-size: 1.1rem;
border-radius: 5px;
cursor: pointer;
transition: background 0.3s;
}
.submit-btn:hover { background-color: var(--dark-blue); }
/* --- FOOTER --- */
footer {
background-color: var(--dark-blue);
colour: var(--white);
padding: 50px 20px 20px;
text-align: heart;
}
.footer-content {
max-width: 1200px;
margin: 0 auto;
show: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
hole: 40px;
margin-bottom: 40px;
text-align: left;
}
.footer-col h3 {
colour: var(--accent-gold);
margin-bottom: 20px;
border-bottom: 2px strong rgba(255,255,255,0.2);
padding-bottom: 10px;
show: inline-block;
}
.footer-col ul li { margin-bottom: 10px; }
.footer-col ul li a { colour: #ccc; transition: 0.3s; }
.footer-col ul li a:hover { colour: var(--white); }
.copyright {
max-width: 1200px;
margin: 0 auto;
border-top: 1px strong rgba(255,255,255,0.1);
padding-top: 20px;
font-size: 0.9rem;
colour: #aaa;
}
/* --- MEDIA QUERIES (Responsive) --- */
@media (max-width: 768px) {
.nav-links {
show: none; /* Hidden by default on cellular */
flex-direction: column;
place: absolute;
high: 70px;
proper: 0;
background-color: var(--white);
width: 100%;
text-align: heart;
padding: 20px 0;
box-shadow: 0 5px 5px rgba(0,0,0,0.1);
}
.nav-links.energetic { show: flex; }
.menu-toggle { show: block; }
.hero h1 { font-size: 2.5rem; }
}
</model>
</head>
<physique>
<!-- HEADER -->
<header>
<div class="navbar">
<div class="emblem">
<span>🇮🇳</span> IndiaTravels
</div>
<div class="menu-toggle" onclick="toggleMenu()">☰</div>
<nav class="nav-links">
<li><a href="#dwelling">House</a></li>
<li><a href="#heritage">Heritage</a></li>
<li><a href="#journey">Journey</a></li>
<li><a href="#contact">Contact</a></li>
<li><a href="#contact" class="cta-btn" model="colour: white;">Ebook Now</a></li>
</nav>
</div>
</header>
<!-- HERO SECTION -->
<part id="dwelling" class="hero">
<h1>Uncover the Soul of India</h1>
<p>From the majestic Himalayas to the serene backwaters of Kerala, expertise the colours, tradition, and chaos of the subcontinent.</p>
<a href="#heritage" class="cta-btn" model="background-color: var(--accent-gold); colour: #333;">Discover Packages</a>
</part>
<!-- HERITAGE / DESTINATIONS PACKAGES -->
<part id="heritage" class="section-container">
<div class="section-header">
<h2>Iconic India: Heritage Circuits</h2>
<hr>
<p model="margin-top:10px; colour:var(--text-light);">Expertise the grandeur of palaces, historical temples, and vibrant cities.</p>
</div>
<div class="packages-grid">
<!-- Bundle 1 -->
<div class="package-card">
<img src="https://photos.unsplash.com/photo-1502602898657-3e91760cbb34?auto=format&match=crop&w=600&q=80" alt="Taj Mahal" class="card-image">
<div class="card-content">
<span class="card-tag">Northern Circuit</span>
<h3 class="card-title">The Golden Triangle</h3>
<p class="card-desc">Delhi, Agra, and Jaipur. Discover Mughal structure, fortresses, and the colourful bazaars of Rajasthan.</p>
<div class="card-features">
<div class="feature-item"><span>7 Days</span></div>
<div class="feature-item"><span>4 Cities</span></div>
<div class="feature-item"><span>Resort Included</span></div>
</div>
<div model="margin-top: 15px;">
<span class="price-tag" model="float: left; margin-right: 20px;">$350</span>
<button class="book-btn" onclick="alert('Booked: Golden Triangle Bundle')">Ebook Now</button>
</div>
</div>
</div>
<!-- Bundle 2 -->
<div class="package-card">
<img src="https://photos.unsplash.com/photo-1536613853304-368635385149?auto=format&match=crop&w=600&q=80" alt="Goa Seashores" class="card-image">
<div class="card-content">
<span class="card-tag">West Coast</span>
<h3 class="card-title">Goa Seaside & Get together Tour</h3>
<p class="card-desc">Chill out on sun-kissed seashores, expertise vibrant night time life, and luxuriate in water sports activities in South Goa and North Goa.</p>
<div class="card-features">
<div class="feature-item"><span>5 Days</span></div>
<div class="feature-item"><span>Seaside Resorts</span></div>
<div class="feature-item"><span>Events Included</span></div>
</div>
<div model="margin-top: 15px;">
<span class="price-tag" model="float: left; margin-right: 20px;">$280</span>
<button class="book-btn" onclick="alert('Booked: Goa Tour')">Ebook Now</button>
</div>
</div>
</div>
<!-- Bundle 3 -->
<div class="package-card">
<img src="https://photos.unsplash.com/photo-1598511874252-447426ac3d65?auto=format&match=crop&w=600&q=80" alt="Kerala Backwaters" class="card-image">
<div class="card-content">
<span class="card-tag">Southern Serenity</span>
<h3 class="card-title">Kerala Backwaters & Wildlife</h3>
<p class="card-desc"> Cruise on houseboats in Alleppey, go to spice plantations, and spot tigers in Periyar Wildlife Sanctuary.</p>
<div class="card-features">
<div class="feature-item"><span>6 Days</span></div>
<div class="feature-item"><span>Houseboat Keep</span></div>
<div class="feature-item"><span>Spice Excursions</span></div>
</div>
<div model="margin-top: 15px;">
<span class="price-tag" model="float: left; margin-right: 20px;">$420</span>
<button class="book-btn" onclick="alert('Booked: Kerala Backwaters')">Ebook Now</button>
</div>
</div>
</div>
</div>
</part>
<!-- ADVENTURE PACKAGES SECTION -->
<part id="journey" class="section-container">
<div class="section-header">
<h2>Thrill Seekers: Journey Actions</h2>
<hr>
<p model="margin-top:10px; colour:var(--text-light);">Get your adrenaline pumping within the mountains, deserts, and oceans of India.</p>
</div>
<div class="packages-grid">
<!-- Journey 1 -->
<div class="package-card" model="border-top: 5px strong var(--accent-gold);">
<img src="https://photos.unsplash.com/photo-1544556912-b6bb7223b97b?auto=format&match=crop&w=600&q=80" alt="Rishikesh" class="card-image">
<div class="card-content">
<span class="card-tag" model="background-color: #fff3e0; colour: #e65100;">Bungee & River</span>
<h3 class="card-title">Rishikesh Journey Camp</h3>
<p class="card-desc">Bungee leaping, river rafting, and mountain climbing within the yoga capital of the world, nestled within the Himalayas.</p>
<div class="card-features">
<div class="feature-item"><span>2 Days</span></div>
<div class="feature-item"><span>Camp Keep</span></div>
<div class="feature-item"><span>Skilled Gear</span></div>
</div>
<div model="margin-top: 15px;">
<span class="price-tag" model="float: left; margin-right: 20px;">$120</span>
<button class="book-btn" onclick="alert('Booked: Rishikesh Journey')">Ebook Now</button>
</div>
</div>
</div>
<!-- Journey 2 -->
<div class="package-card" model="border-top: 5px strong var(--accent-gold);">
<img src="https://photos.unsplash.com/photo-1552832230-c0197dd311b5?auto=format&match=crop&w=600&q=80" alt="Ladakh" class="card-image">
<div class="card-content">
<span class="card-tag" model="background-color: #e3f2fd; colour: var(--primary-blue);">Excessive Altitude</span>
<h3 class="card-title">Ladakh Bike Safari</h3>
<p class="card-desc">Journey by way of the world's highest motorable roads, cross Shinga La move, and see the pristine Pangong Lake.</p>
<div class="card-features">
<div class="feature-item"><span>8 Days</span></div>
<div class="feature-item"><span>Self-Drive Bike</span></div>
<div class="feature-item"><span>Information Included</span></div>
</div>
<div model="margin-top: 15px;">
<span class="price-tag" model="float: left; margin-right: 20px;">$600</span>
<button class="book-btn" onclick="alert('Booked: Ladakh Safari')">Ebook Now</button>
</div>
</div>
</div>
<!-- Journey 3 -->
<div class="package-card" model="border-top: 5px strong var(--accent-gold);">
<img src="https://photos.unsplash.com/photo-1565958011703-346a11d65174?auto=format&match=crop&w=600&q=80" alt="Jaisalmer" class="card-image">
<div class="card-content">
<span class="card-tag" model="background-color: #fff8e1; colour: #f57f17;">Desert Safari</span>
<h3 class="card-title">Thar Desert Camp (Jaisalmer)</h3>
<p class="card-desc">Camel using at sundown, conventional Rajasthani dinner underneath the celebrities, and sleeping in luxurious tented camps.</p>
<div class="card-features">
<div class="feature-item"><span>1 Day</span></div>
<div class="feature-item"><span>Camel Journey</span></div>
<div class="feature-item"><span>Dinner & Dance</span></div>
</div>
<div model="margin-top: 15px;">
<span class="price-tag" model="float: left; margin-right: 20px;">$80</span>
<button class="book-btn" onclick="alert('Booked: Desert Safari')">Ebook Now</button>
</div>
</div>
</div>
</div>
</part>
<!-- CONTACT SECTION -->
<part id="contact" class="section-container contact-section">
<div class="section-header">
<h2 model="colour: var(--primary-blue);">Plan Your Journey</h2>
<hr>
<p>Contact us for customized tour packages</p>
</div>
<div class="contact-container">
<kind>
<enter sort="textual content" placeholder="Your Identify" required>
<enter sort="e-mail" placeholder="Your E mail Deal with" required>
<enter sort="tel" placeholder="Telephone Quantity">
<textarea placeholder="Inform us about your dream India trip (Dates, Pursuits, Finances)..."></textarea>
<button sort="submit" class="submit-btn">Request Quote</button>
</kind>
</div>
</part>
<!-- FOOTER -->
<footer>
<div class="footer-content">
<div class="footer-col">
<h3>IndiaTravels</h3>
<p model="colour: #ccc; font-size: 0.9rem;">Your trusted companion to discover the colourful tradition, majestic monuments, and pure great thing about India.</p>
</div>
<div class="footer-col">
<h3>Fast Hyperlinks</h3>
<ul>
<li><a href="#dwelling">House</a></li>
<li><a href="#heritage">Heritage Packages</a></li>
<li><a href="#journey">Journey Excursions</a></li>
<li><a href="#contact">Contact Us</a></li>
</ul>
</div>
<div class="footer-col">
<h3>Contact Data</h3>
<ul>
<li>123, Tourism Complicated, New Delhi</li>
<li>+91 98765 43210</li>
<li>[email protected]</li>
<li>MON-SAT: 9AM - 8PM</li>
</ul>
</div>
</div>
<div class="copyright">
© 2023 India Travels & Tourism. All Rights Reserved.
</div>
</footer>
<!-- JAVASCRIPT FOR MENU -->
<script>
operate toggleMenu() {
const navLinks = doc.querySelector('.nav-links');
navLinks.classList.toggle('energetic');
}
// Shut menu when a hyperlink is clicked (for cellular)
doc.querySelectorAll('.nav-links a').forEach(hyperlink => {
hyperlink.addEventListener('click on', () => {
const navLinks = doc.querySelector('.nav-links');
if (navLinks.classList.incorporates('energetic')) {
navLinks.classList.take away('energetic');
}
});
});
</script>
</physique>
</html>
That is hands-down the most effective AI-coded web sites I’ve seen to this point. It tends to have every little thing in place, with an correct depiction of all directions in addition to the weather that I didn’t actually specify. The color scheme is on level. The spacing and sections are nicely laid out, and the textual content is simply excellent to learn. That is the sort of output that may take you straight from a immediate to going stay, so kudos to Qwen3-Coder-Subsequent for the tremendous fast and near-perfect output.
Conclusion
At first look, Qwen3-Coder-Subsequent makes some massive guarantees – coding brokers, strong reasoning, and the power to run regionally at a minimal inference value. However after you have a have a look at its benchmark efficiency, you already know these aren’t simply phrases thrown within the air. These are backed by some very actual efficiency metrics.
And that’s while you really feel that the brand new Qwen mannequin is already sensible sufficient for real-world improvement workflows. That mentioned, that is clearly not the top of the highway. Whereas the mannequin performs competitively even towards a lot bigger open-source techniques, the Qwen group is upfront in regards to the room for enchancment. And that honesty issues.
Wanting forward, Qwen’s focus is firmly on strengthening agent abilities: higher reasoning, smarter instrument use, broader activity protection. It even guarantees fast updates based mostly on “how folks use it.” Now that’s the sort of dedication you want from the makers of an incredible AI mannequin. And if this trajectory holds, it gained’t be a marvel when Qwen3-Coder-Subsequent will evolve from a powerful native coding assistant right into a genuinely autonomous software program agent.
Login to proceed studying and luxuriate in expert-curated content material.







