diff --git a/app/components/atlas.client.tsx b/app/components/atlas.client.tsx
index 9b7aa43..e9906d7 100644
--- a/app/components/atlas.client.tsx
+++ b/app/components/atlas.client.tsx
@@ -9,6 +9,7 @@ import {
   useCapitalProjectsLayer,
   useCommunityDistrictsLayer,
   useCityCouncilDistrictsLayer,
+  useCommunityDistrictLayer,
 } from "./layers";
 import type { MapView, MapViewState } from "@deck.gl/core";
 
@@ -26,6 +27,7 @@ const MIN_ZOOM = 10;
 export function Atlas() {
   const capitalProjectsLayer = useCapitalProjectsLayer();
   const communityDistrictsLayer = useCommunityDistrictsLayer();
+  const communityDistrictLayer = useCommunityDistrictLayer();
   const cityCouncilDistrictsLayer = useCityCouncilDistrictsLayer();
 
   const isMobile = useMediaQuery("(max-width: 767px)")[0];
@@ -67,6 +69,7 @@ export function Atlas() {
       layers={[
         capitalProjectsLayer,
         communityDistrictsLayer,
+        communityDistrictLayer,
         cityCouncilDistrictsLayer,
       ]}
       getCursor={({ isDragging, isHovering }) => {
diff --git a/app/components/layers/index.tsx b/app/components/layers/index.tsx
index 31be71a..9433b02 100644
--- a/app/components/layers/index.tsx
+++ b/app/components/layers/index.tsx
@@ -1,3 +1,4 @@
 export { useCapitalProjectsLayer } from "./useCapitalProjectsLayer.client";
 export { useCommunityDistrictsLayer } from "./useCommunityDistrictsLayer.client";
+export { useCommunityDistrictLayer } from "./useCommunityDistrictLayer.client";
 export { useCityCouncilDistrictsLayer } from "./useCityCouncilDistrictsLayer.client";
diff --git a/app/components/layers/useCapitalProjectsLayer.client.tsx b/app/components/layers/useCapitalProjectsLayer.client.tsx
index 647dd73..9cdf3ae 100644
--- a/app/components/layers/useCapitalProjectsLayer.client.tsx
+++ b/app/components/layers/useCapitalProjectsLayer.client.tsx
@@ -6,14 +6,19 @@ export interface CapitalProjectProperties {
   managingAgency: string;
 }
 export function useCapitalProjectsLayer() {
-  const { managingCode, capitalProjectId } = useParams();
+  const { managingCode, capitalProjectId, boroughId, communityDistrictId } =
+    useParams();
   const [searchParams] = useSearchParams();
   const navigate = useNavigate();
 
+  let endpointPrefix = "";
+  if (boroughId !== undefined && communityDistrictId !== undefined)
+    endpointPrefix = `boroughs/${boroughId}/community-districts/${communityDistrictId}/`;
+
   return new MVTLayer<CapitalProjectProperties>({
     id: "capitalProjects",
     data: [
-      `${import.meta.env.VITE_ZONING_API_URL}/api/capital-projects/{z}/{x}/{y}.pbf`,
+      `${import.meta.env.VITE_ZONING_API_URL}/api/${endpointPrefix}capital-projects/{z}/{x}/{y}.pbf`,
     ],
     uniqueIdProperty: "managingCodeCapitalProjectId",
     autoHighlight: true,
diff --git a/app/components/layers/useCommunityDistrictLayer.client.tsx b/app/components/layers/useCommunityDistrictLayer.client.tsx
new file mode 100644
index 0000000..ec3828d
--- /dev/null
+++ b/app/components/layers/useCommunityDistrictLayer.client.tsx
@@ -0,0 +1,22 @@
+import { GeoJsonLayer } from "@deck.gl/layers";
+import { useParams } from "@remix-run/react";
+
+export function useCommunityDistrictLayer() {
+  const { boroughId, communityDistrictId } = useParams();
+  const hasCommunityDistrict =
+    boroughId !== undefined && communityDistrictId !== undefined;
+  const data = hasCommunityDistrict
+    ? `${import.meta.env.VITE_ZONING_API_URL}/api/boroughs/${boroughId}/community-districts/${communityDistrictId}/geojson`
+    : [];
+
+  return new GeoJsonLayer({
+    id: "CommunityDistrict",
+    data,
+    visible: hasCommunityDistrict,
+    filled: false,
+    stroked: true,
+    lineWidthUnits: "pixels",
+    getLineWidth: 3,
+    getLineColor: [49, 151, 149],
+  });
+}
diff --git a/app/routes/boroughs.$boroughId.community-districts.$communityDistrictId.capital-projects.tsx b/app/routes/boroughs.$boroughId.community-districts.$communityDistrictId.capital-projects.tsx
new file mode 100644
index 0000000..a5b749a
--- /dev/null
+++ b/app/routes/boroughs.$boroughId.community-districts.$communityDistrictId.capital-projects.tsx
@@ -0,0 +1,3 @@
+export default function CapitalProjectsByBoroughIdCommunityDistrictId() {
+  return <></>;
+}
diff --git a/package-lock.json b/package-lock.json
index 8ebf466..e637159 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,10 +9,11 @@
       "version": "0.0.1",
       "dependencies": {
         "@chakra-ui/icons": "^2.1.1",
-        "@deck.gl/core": "^9.0.20",
-        "@deck.gl/geo-layers": "^9.0.20",
-        "@deck.gl/react": "^9.0.20",
-        "@deck.gl/widgets": "^9.0.20",
+        "@deck.gl/core": "^9.0.26",
+        "@deck.gl/geo-layers": "^9.0.26",
+        "@deck.gl/layers": "^9.0.26",
+        "@deck.gl/react": "^9.0.26",
+        "@deck.gl/widgets": "^9.0.26",
         "@emotion/react": "^11.11.3",
         "@emotion/server": "^11.11.0",
         "@emotion/styled": "^11.11.0",
@@ -2487,10 +2488,9 @@
       }
     },
     "node_modules/@deck.gl/core": {
-      "version": "9.0.23",
-      "resolved": "https://registry.npmjs.org/@deck.gl/core/-/core-9.0.23.tgz",
-      "integrity": "sha512-09WjdeSfauruBGFY2iLuwzC3V1wUjFUvmteA/FaSj4pgtN9J+3Nev2LNcGwc7y9V/dzNSGxuGQRD2georJGKjg==",
-      "license": "MIT",
+      "version": "9.0.26",
+      "resolved": "https://registry.npmjs.org/@deck.gl/core/-/core-9.0.26.tgz",
+      "integrity": "sha512-jtKFdUstKqAQF6XElmoFU9EbDpHsUHZuQ11rhLVV+++D1qdOss8FJLkWAGQ0tp4Yb/N0yT7BY+efxfVlRTtNVw==",
       "dependencies": {
         "@loaders.gl/core": "^4.2.0",
         "@loaders.gl/images": "^4.2.0",
@@ -2528,10 +2528,9 @@
       }
     },
     "node_modules/@deck.gl/geo-layers": {
-      "version": "9.0.23",
-      "resolved": "https://registry.npmjs.org/@deck.gl/geo-layers/-/geo-layers-9.0.23.tgz",
-      "integrity": "sha512-qKcJis1ma6UEjGcKkbbVe8vba00PvFevon3h5akJiZLhwdyDuyb0HLB3pdrep/+X65m2P9ATxrkMIaRKu4ir7w==",
-      "license": "MIT",
+      "version": "9.0.26",
+      "resolved": "https://registry.npmjs.org/@deck.gl/geo-layers/-/geo-layers-9.0.26.tgz",
+      "integrity": "sha512-KRw5sR6krQa59D3dQKFZor+1reFisAChcT6Bt1koyBQ+EGySHIrJzKCKoHC5ofhwoImoqt/YOjbJ9GgD9NalWg==",
       "dependencies": {
         "@loaders.gl/3d-tiles": "^4.2.0",
         "@loaders.gl/gis": "^4.2.0",
@@ -2561,11 +2560,10 @@
       }
     },
     "node_modules/@deck.gl/layers": {
-      "version": "9.0.23",
-      "resolved": "https://registry.npmjs.org/@deck.gl/layers/-/layers-9.0.23.tgz",
-      "integrity": "sha512-aFhd/xrCNqtXEZUf+nX0s6zetZmquha+hc8ra9zoI7LSs2l/fnhmFltx3p//QsYkJCT4yxQiQdlhDwzmj+y/yQ==",
+      "version": "9.0.26",
+      "resolved": "https://registry.npmjs.org/@deck.gl/layers/-/layers-9.0.26.tgz",
+      "integrity": "sha512-a3TEXqVSfbo0+itaqp6iy0mSaKJDcfzmSYG8p6O7w8+AhDjH5qmGwRGTQKiRvP3b1KOxEd0CPr2W440T/BRLCw==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@loaders.gl/images": "^4.2.0",
         "@loaders.gl/schema": "^4.2.0",
@@ -2600,10 +2598,9 @@
       }
     },
     "node_modules/@deck.gl/react": {
-      "version": "9.0.23",
-      "resolved": "https://registry.npmjs.org/@deck.gl/react/-/react-9.0.23.tgz",
-      "integrity": "sha512-PE0aAT8DzIlDZGJu7UIrD0326bT9HQ02zrkAHing+dGvWqa1rn6R5hUpez8W8KqTBQ8BhKlMDD8KmWmTrWiCEA==",
-      "license": "MIT",
+      "version": "9.0.26",
+      "resolved": "https://registry.npmjs.org/@deck.gl/react/-/react-9.0.26.tgz",
+      "integrity": "sha512-t8fVQj0S3vUVfKpGLyKhhUYi2pe1fPysR8oSpkt+HYPdc9rVmLH38IfpXydA7FWznhBlDghqwFzi+JyE/L4nMA==",
       "peerDependencies": {
         "@deck.gl/core": "^9.0.0",
         "react": ">=16.3.0",
@@ -2611,10 +2608,9 @@
       }
     },
     "node_modules/@deck.gl/widgets": {
-      "version": "9.0.23",
-      "resolved": "https://registry.npmjs.org/@deck.gl/widgets/-/widgets-9.0.23.tgz",
-      "integrity": "sha512-5oii3db5v34suj0npnxCSSARwKkuRD4v6Uzyd3zLdg8WNFd/Zj/6pMzYBeQzmK+bVgsHMAFjn8iocOlaA4jQXg==",
-      "license": "MIT",
+      "version": "9.0.26",
+      "resolved": "https://registry.npmjs.org/@deck.gl/widgets/-/widgets-9.0.26.tgz",
+      "integrity": "sha512-m+ucJ1klMybRxgQ6GN3kCqdH1bZgO8ozYD9kQ+aGeF0tcvIzJxh0PBb68Wpxlne41X4Ps9cZX3hzOfyZU103Qg==",
       "dependencies": {
         "preact": "^10.17.0"
       },
diff --git a/package.json b/package.json
index 6a84c0e..6168dd1 100644
--- a/package.json
+++ b/package.json
@@ -18,10 +18,11 @@
   },
   "dependencies": {
     "@chakra-ui/icons": "^2.1.1",
-    "@deck.gl/core": "^9.0.20",
-    "@deck.gl/geo-layers": "^9.0.20",
-    "@deck.gl/react": "^9.0.20",
-    "@deck.gl/widgets": "^9.0.20",
+    "@deck.gl/core": "^9.0.26",
+    "@deck.gl/geo-layers": "^9.0.26",
+    "@deck.gl/layers": "^9.0.26",
+    "@deck.gl/react": "^9.0.26",
+    "@deck.gl/widgets": "^9.0.26",
     "@emotion/react": "^11.11.3",
     "@emotion/server": "^11.11.0",
     "@emotion/styled": "^11.11.0",