diff --git a/submit-challenge/index.html b/submit-challenge/index.html
new file mode 100644
index 00000000..bfe5e8b1
--- /dev/null
+++ b/submit-challenge/index.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8" />
+  <title>Submit Coding Challenge</title>
+  <link rel="stylesheet" href="styles.css" />
+</head>
+<body>
+  <main class="container">
+    <h2>Submit New Coding Challenge</h2>
+    <form id="challengeForm">
+      <label for="title">Title</label>
+      <input id="title" name="title" type="text" required />
+
+      <label for="description">Description</label>
+      <textarea id="description" name="description" required></textarea>
+
+      <label for="difficulty">Difficulty</label>
+      <select id="difficulty" name="difficulty" required>
+        <option value="">Select</option>
+        <option>Easy</option>
+        <option>Medium</option>
+        <option>Hard</option>
+      </select>
+
+      <label>Test Cases</label>
+      <div id="testCases">
+        <input type="text" class="test-case" placeholder="Test Case 1" required />
+      </div>
+      <button type="button" id="addTestCase">+ Add Test Case</button>
+
+      <label for="solution">Sample Solution</label>
+      <textarea id="solution" name="solution" required></textarea>
+
+      <button type="submit">Submit</button>
+    </form>
+
+    <section id="preview"></section>
+  </main>
+  <script src="submit-challenge/script.js"></script>
+
+</body>
+</html>
diff --git a/submit-challenge/script.js b/submit-challenge/script.js
new file mode 100644
index 00000000..30e734d9
--- /dev/null
+++ b/submit-challenge/script.js
@@ -0,0 +1,35 @@
+const form = document.getElementById('challengeForm');
+const testCasesDiv = document.getElementById('testCases');
+const addBtn = document.getElementById('addTestCase');
+const preview = document.getElementById('preview');
+
+addBtn.addEventListener('click', () => {
+  const input = document.createElement('input');
+  input.type = 'text';
+  input.className = 'test-case';
+  input.placeholder = `Test Case ${testCasesDiv.children.length + 1}`;
+  input.required = true;
+  testCasesDiv.appendChild(input);
+});
+
+form.addEventListener('submit', (e) => {
+  e.preventDefault();
+
+  const title = document.getElementById('title').value.trim();
+  const description = document.getElementById('description').value.trim();
+  const difficulty = document.getElementById('difficulty').value;
+  const solution = document.getElementById('solution').value.trim();
+
+  const testCases = Array.from(document.querySelectorAll('.test-case'))
+    .map(input => input.value.trim())
+    .filter(Boolean);
+
+  preview.innerHTML = `
+    <h3>Preview</h3>
+    <p><strong>Title:</strong> ${title}</p>
+    <p><strong>Difficulty:</strong> ${difficulty}</p>
+    <p><strong>Description:</strong><br>${description.replace(/\n/g, "<br>")}</p>
+    <p><strong>Test Cases:</strong><ul>${testCases.map(tc => `<li>${tc}</li>`).join('')}</ul></p>
+    <p><strong>Sample Solution:</strong><br><pre>${solution}</pre></p>
+  `;
+});
diff --git a/submit-challenge/styles.css b/submit-challenge/styles.css
new file mode 100644
index 00000000..23a82cd3
--- /dev/null
+++ b/submit-challenge/styles.css
@@ -0,0 +1,34 @@
+body {
+  font-family: sans-serif;
+  background: #f0f0f0;
+  padding: 2rem;
+}
+
+.container {
+  max-width: 700px;
+  background: white;
+  padding: 2rem;
+  margin: auto;
+  border-radius: 10px;
+}
+
+form {
+  display: flex;
+  flex-direction: column;
+}
+
+label {
+  margin-top: 1rem;
+}
+
+input, textarea, select, button {
+  padding: 0.5rem;
+  font-size: 1rem;
+  margin-top: 0.3rem;
+}
+
+#preview {
+  margin-top: 2rem;
+  background: #e0e0ff;
+  padding: 1rem;
+}
