diff --git a/contributors.yml b/contributors.yml
index 70d633a861..c5aa159a28 100644
--- a/contributors.yml
+++ b/contributors.yml
@@ -16,6 +16,7 @@
 - petersendidit
 - RobHannay
 - sergiodxa
+- shamsup
 - shivamsinghchahar
 - thisiskartik
 - timdorr
diff --git a/packages/react-router/__tests__/descendant-routes-splat-matching-test.tsx b/packages/react-router/__tests__/descendant-routes-splat-matching-test.tsx
index 5c94dd9023..33d2b3a675 100644
--- a/packages/react-router/__tests__/descendant-routes-splat-matching-test.tsx
+++ b/packages/react-router/__tests__/descendant-routes-splat-matching-test.tsx
@@ -1,6 +1,7 @@
 import * as React from "react";
 import * as TestRenderer from "react-test-renderer";
-import { MemoryRouter, Outlet, Routes, Route } from "react-router";
+import { MemoryRouter, Outlet, Routes, Route, useParams } from "react-router";
+import type { InitialEntry } from "history";
 
 describe("Descendant <Routes> splat matching", () => {
   describe("when the parent route path ends with /*", () => {
@@ -57,5 +58,158 @@ describe("Descendant <Routes> splat matching", () => {
         </div>
       `);
     });
+    describe("works with paths beginning with special characters", () => {
+      function PrintParams() {
+        return <p>The params are {JSON.stringify(useParams())}</p>;
+      }
+      function ReactCourses() {
+        return (
+          <div>
+            <h1>React</h1>
+            <Routes>
+              <Route
+                path=":splat"
+                element={
+                  <div>
+                    <h1>React Fundamentals</h1>
+                    <PrintParams />
+                  </div>
+                }
+              />
+            </Routes>
+          </div>
+        );
+      }
+
+      function Courses() {
+        return (
+          <div>
+            <h1>Courses</h1>
+            <Outlet />
+          </div>
+        );
+      }
+
+      function renderNestedSplatRoute(initialEntries: InitialEntry[]) {
+        let renderer: TestRenderer.ReactTestRenderer;
+        TestRenderer.act(() => {
+          renderer = TestRenderer.create(
+            <MemoryRouter initialEntries={initialEntries}>
+              <Routes>
+                <Route path="courses" element={<Courses />}>
+                  <Route path="react/*" element={<ReactCourses />} />
+                </Route>
+              </Routes>
+            </MemoryRouter>
+          );
+        });
+        return renderer;
+      }
+
+      it("allows `-` to appear at the beginning", () => {
+        let renderer = renderNestedSplatRoute([
+          "/courses/react/-react-fundamentals"
+        ]);
+        expect(renderer.toJSON()).toMatchInlineSnapshot(`
+          <div>
+            <h1>
+              Courses
+            </h1>
+            <div>
+              <h1>
+                React
+              </h1>
+              <div>
+                <h1>
+                  React Fundamentals
+                </h1>
+                <p>
+                  The params are 
+                  {"*":"-react-fundamentals","splat":"-react-fundamentals"}
+                </p>
+              </div>
+            </div>
+          </div>
+        `);
+      });
+      it("allows `.` to appear at the beginning", () => {
+        let renderer = renderNestedSplatRoute([
+          "/courses/react/.react-fundamentals"
+        ]);
+        expect(renderer.toJSON()).toMatchInlineSnapshot(`
+          <div>
+            <h1>
+              Courses
+            </h1>
+            <div>
+              <h1>
+                React
+              </h1>
+              <div>
+                <h1>
+                  React Fundamentals
+                </h1>
+                <p>
+                  The params are 
+                  {"*":".react-fundamentals","splat":".react-fundamentals"}
+                </p>
+              </div>
+            </div>
+          </div>
+        `);
+      });
+      it("allows `~` to appear at the beginning", () => {
+        let renderer = renderNestedSplatRoute([
+          "/courses/react/~react-fundamentals"
+        ]);
+        expect(renderer.toJSON()).toMatchInlineSnapshot(`
+          <div>
+            <h1>
+              Courses
+            </h1>
+            <div>
+              <h1>
+                React
+              </h1>
+              <div>
+                <h1>
+                  React Fundamentals
+                </h1>
+                <p>
+                  The params are 
+                  {"*":"~react-fundamentals","splat":"~react-fundamentals"}
+                </p>
+              </div>
+            </div>
+          </div>
+        `);
+      });
+      it("allows url-encoded entities to appear at the beginning", () => {
+        let renderer = renderNestedSplatRoute([
+          "/courses/react/%20react-fundamentals"
+        ]);
+        expect(renderer.toJSON()).toMatchInlineSnapshot(`
+          <div>
+            <h1>
+              Courses
+            </h1>
+            <div>
+              <h1>
+                React
+              </h1>
+              <div>
+                <h1>
+                  React Fundamentals
+                </h1>
+                <p>
+                  The params are 
+                  {"*":" react-fundamentals","splat":" react-fundamentals"}
+                </p>
+              </div>
+            </div>
+          </div>
+        `);
+      });
+    });
   });
 });
diff --git a/packages/react-router/__tests__/layout-routes-test.tsx b/packages/react-router/__tests__/layout-routes-test.tsx
index ae0f5b9ab5..0884451520 100644
--- a/packages/react-router/__tests__/layout-routes-test.tsx
+++ b/packages/react-router/__tests__/layout-routes-test.tsx
@@ -31,4 +31,211 @@ describe("A layout route", () => {
       </h1>
     `);
   });
+  describe("matches when a nested splat route begins with a special character", () => {
+    it("allows routes starting with `-`", () => {
+      let renderer: TestRenderer.ReactTestRenderer;
+      TestRenderer.act(() => {
+        renderer = TestRenderer.create(
+          <MemoryRouter initialEntries={["/-splat"]}>
+            <Routes>
+              <Route
+                element={
+                  <div>
+                    <h1>Layout</h1>
+                    <Outlet />
+                  </div>
+                }
+              >
+                <Route
+                  path="*"
+                  element={
+                    <div>
+                      <h1>Splat</h1>
+                    </div>
+                  }
+                />
+              </Route>
+            </Routes>
+          </MemoryRouter>
+        );
+      });
+
+      expect(renderer.toJSON()).toMatchInlineSnapshot(`
+        <div>
+          <h1>
+            Layout
+          </h1>
+          <div>
+            <h1>
+              Splat
+            </h1>
+          </div>
+        </div>
+      `);
+    });
+    it("allows routes starting with `~`", () => {
+      let renderer: TestRenderer.ReactTestRenderer;
+      TestRenderer.act(() => {
+        renderer = TestRenderer.create(
+          <MemoryRouter initialEntries={["/~splat"]}>
+            <Routes>
+              <Route
+                element={
+                  <div>
+                    <h1>Layout</h1>
+                    <Outlet />
+                  </div>
+                }
+              >
+                <Route
+                  path="*"
+                  element={
+                    <div>
+                      <h1>Splat</h1>
+                    </div>
+                  }
+                />
+              </Route>
+            </Routes>
+          </MemoryRouter>
+        );
+      });
+
+      expect(renderer.toJSON()).toMatchInlineSnapshot(`
+        <div>
+          <h1>
+            Layout
+          </h1>
+          <div>
+            <h1>
+              Splat
+            </h1>
+          </div>
+        </div>
+      `);
+    });
+    it("allows routes starting with `_`", () => {
+      let renderer: TestRenderer.ReactTestRenderer;
+      TestRenderer.act(() => {
+        renderer = TestRenderer.create(
+          <MemoryRouter initialEntries={["/_splat"]}>
+            <Routes>
+              <Route
+                element={
+                  <div>
+                    <h1>Layout</h1>
+                    <Outlet />
+                  </div>
+                }
+              >
+                <Route
+                  path="*"
+                  element={
+                    <div>
+                      <h1>Splat</h1>
+                    </div>
+                  }
+                />
+              </Route>
+            </Routes>
+          </MemoryRouter>
+        );
+      });
+
+      expect(renderer.toJSON()).toMatchInlineSnapshot(`
+        <div>
+          <h1>
+            Layout
+          </h1>
+          <div>
+            <h1>
+              Splat
+            </h1>
+          </div>
+        </div>
+      `);
+    });
+    it("allows routes starting with `.`", () => {
+      let renderer: TestRenderer.ReactTestRenderer;
+      TestRenderer.act(() => {
+        renderer = TestRenderer.create(
+          <MemoryRouter initialEntries={["/.splat"]}>
+            <Routes>
+              <Route
+                element={
+                  <div>
+                    <h1>Layout</h1>
+                    <Outlet />
+                  </div>
+                }
+              >
+                <Route
+                  path="*"
+                  element={
+                    <div>
+                      <h1>Splat</h1>
+                    </div>
+                  }
+                />
+              </Route>
+            </Routes>
+          </MemoryRouter>
+        );
+      });
+
+      expect(renderer.toJSON()).toMatchInlineSnapshot(`
+        <div>
+          <h1>
+            Layout
+          </h1>
+          <div>
+            <h1>
+              Splat
+            </h1>
+          </div>
+        </div>
+      `);
+    });
+    it("allows routes starting with url-encoded entities", () => {
+      let renderer: TestRenderer.ReactTestRenderer;
+      TestRenderer.act(() => {
+        renderer = TestRenderer.create(
+          <MemoryRouter initialEntries={["/%20splat"]}>
+            <Routes>
+              <Route
+                element={
+                  <div>
+                    <h1>Layout</h1>
+                    <Outlet />
+                  </div>
+                }
+              >
+                <Route
+                  path="*"
+                  element={
+                    <div>
+                      <h1>Splat</h1>
+                    </div>
+                  }
+                />
+              </Route>
+            </Routes>
+          </MemoryRouter>
+        );
+      });
+
+      expect(renderer.toJSON()).toMatchInlineSnapshot(`
+        <div>
+          <h1>
+            Layout
+          </h1>
+          <div>
+            <h1>
+              Splat
+            </h1>
+          </div>
+        </div>
+      `);
+    });
+  });
 });
diff --git a/packages/react-router/index.tsx b/packages/react-router/index.tsx
index 135d2e6bae..edbee188d4 100644
--- a/packages/react-router/index.tsx
+++ b/packages/react-router/index.tsx
@@ -1222,7 +1222,10 @@ function compilePath(
       : // Otherwise, match a word boundary or a proceeding /. The word boundary restricts
         // parent routes to matching only their own words and nothing more, e.g. parent
         // route "/home" should not match "/home2".
-        "(?:\\b|\\/|$)";
+        // Additionally, allow paths starting with `.`, `-`, `~`, and url-encoded entities,
+        // but do not consume the character in the matched path so they can match against
+        // nested paths.
+        "(?:(?=[.~-]|%[0-9A-F]{2})|\\b|\\/|$)";
   }
 
   let matcher = new RegExp(regexpSource, caseSensitive ? undefined : "i");