diff --git a/components/legislator/LegislatorPage.tsx b/components/legislator/LegislatorPage.tsx
new file mode 100644
index 000000000..ea38fb836
--- /dev/null
+++ b/components/legislator/LegislatorPage.tsx
@@ -0,0 +1,111 @@
+import { faChevronRight } from "@fortawesome/free-solid-svg-icons"
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
+import { collectionGroup, getDocs, query, where } from "firebase/firestore"
+import { useTranslation } from "next-i18next"
+import ErrorPage from "next/error"
+import { useEffect, useState } from "react"
+import styled from "styled-components"
+
+import { Role, useAuth } from "../auth"
+import { Col, Container, Row, Spinner } from "../bootstrap"
+import { usePublicProfile, usePublishedTestimonyListing } from "../db"
+import {
+  Back,
+  ButtonContainer,
+  FeatureCalloutButton
+} from "../shared/CommonComponents"
+import { Banner } from "../shared/StyledSharedComponents"
+import ViewTestimony from "../TestimonyCard/ViewTestimony"
+
+import { LegislatorSidebar } from "./SidebarComponents/LegislatorSidebar"
+import { LegislatorTabs } from "./TabComponents/LegislatorTabs"
+//import { OrgContactInfo } from "./OrgContactInfo"
+//import { ProfileAboutSection } from "./ProfileAboutSection"
+//import { ProfileHeader } from "./ProfileHeader"
+//import { ProfileLegislators } from "./ProfileLegislators"
+//import { VerifyAccountSectionLegacy } from "./VerifyAccountSectionLegacy"
+
+import { useFlags } from "components/featureFlags"
+import { firestore } from "components/firebase"
+import { Internal } from "components/links"
+import { PendingUpgradeBanner } from "components/PendingUpgradeBanner"
+import { VerifyAccountSection } from "components/shared"
+import { FollowContext, OrgFollowStatus } from "components/shared/FollowContext"
+
+const DirectoryPath = styled.div`
+  font-size: 12px;
+`
+
+const HeaderBlock = styled.div`
+  background-color: white;
+  border: "1px #ced4da solid";
+  border-radius: 5px;
+  margin-top: 8px;
+  padding: 16px;
+`
+
+const StatBlock = styled(Col)`
+  background-color: white;
+  border: 1px #ced4da solid;
+  border-radius: 5px;
+  margin-top: 4px;
+  padding: 16px;
+`
+
+export function LegislatorPage(props: { id: string }) {
+  const { t } = useTranslation("legislators")
+  const { result: profile, loading } = usePublicProfile(props.id)
+
+  console.log("Pro: ", profile)
+
+  if (loading) {
+    return (
+      <Row>
+        <Spinner animation="border" className="mx-auto" />
+      </Row>
+    )
+  }
+  if (!profile) {
+    return <ErrorPage statusCode={404} withDarkMode={false} />
+  }
+
+  return (
+    <Container className="mt-3 mb-3">
+      <DirectoryPath className="align-items-center d-flex flex-nowrap">
+        <Internal className="text-decoration-none" href="/">
+          {t("home")}
+        </Internal>
+        <FontAwesomeIcon className="fa-2xs px-2 " icon={faChevronRight} />
+        <div style={{ color: "#6c757d" }}>{t("legislators")}</div>
+        <FontAwesomeIcon className="fa-2xs px-2 " icon={faChevronRight} />
+        <div style={{ color: "#6c757d" }}>{profile.fullName}</div>
+      </DirectoryPath>
+
+      <HeaderBlock className="">Header Info Goes Here</HeaderBlock>
+
+      <div className="d-flex flex-wrap gap-2 justify-content-between mt-2">
+        <StatBlock className="col-4 flex-grow-1" md="2">
+          Stat
+        </StatBlock>
+        <StatBlock className="col-4 flex-grow-1" md="2">
+          Info
+        </StatBlock>
+        <StatBlock className="col-4 flex-grow-1" md="2">
+          Goes
+        </StatBlock>
+        <StatBlock className="col-4 flex-grow-1" md="2">
+          Here
+        </StatBlock>
+      </div>
+
+      <Row>
+        <Col className={`mt-4`} md="9">
+          <LegislatorTabs />
+        </Col>
+        <Col className={`mt-4`} md="3">
+          <LegislatorSidebar />
+        </Col>
+      </Row>
+    </Container>
+  )
+}
diff --git a/components/legislator/SidebarComponents/Biography.tsx b/components/legislator/SidebarComponents/Biography.tsx
new file mode 100644
index 000000000..90cf3f5e0
--- /dev/null
+++ b/components/legislator/SidebarComponents/Biography.tsx
@@ -0,0 +1,3 @@
+export function Biography() {
+  return <div>- Biography</div>
+}
diff --git a/components/legislator/SidebarComponents/LegislatorSidebar.tsx b/components/legislator/SidebarComponents/LegislatorSidebar.tsx
new file mode 100644
index 000000000..39f77168e
--- /dev/null
+++ b/components/legislator/SidebarComponents/LegislatorSidebar.tsx
@@ -0,0 +1,14 @@
+import { Biography } from "./Biography"
+import { OtherTestimony } from "./OtherTestimony"
+import { UpcomingHearings } from "./UpcomingHearings"
+
+export function LegislatorSidebar() {
+  return (
+    <>
+      Sidebar Components
+      <OtherTestimony />
+      <UpcomingHearings />
+      <Biography />
+    </>
+  )
+}
diff --git a/components/legislator/SidebarComponents/OtherTestimony.tsx b/components/legislator/SidebarComponents/OtherTestimony.tsx
new file mode 100644
index 000000000..8b3940014
--- /dev/null
+++ b/components/legislator/SidebarComponents/OtherTestimony.tsx
@@ -0,0 +1,3 @@
+export function OtherTestimony() {
+  return <div>- Other Testimony</div>
+}
diff --git a/components/legislator/SidebarComponents/UpcomingHearings.tsx b/components/legislator/SidebarComponents/UpcomingHearings.tsx
new file mode 100644
index 000000000..69e68cb05
--- /dev/null
+++ b/components/legislator/SidebarComponents/UpcomingHearings.tsx
@@ -0,0 +1,3 @@
+export function UpcomingHearings() {
+  return <div>- Upcoming Hearings</div>
+}
diff --git a/components/legislator/TabComponents/Bills.tsx b/components/legislator/TabComponents/Bills.tsx
new file mode 100644
index 000000000..61d6b5918
--- /dev/null
+++ b/components/legislator/TabComponents/Bills.tsx
@@ -0,0 +1,3 @@
+export function Bills() {
+  return <div>- Bills</div>
+}
diff --git a/components/legislator/TabComponents/District.tsx b/components/legislator/TabComponents/District.tsx
new file mode 100644
index 000000000..06025fbff
--- /dev/null
+++ b/components/legislator/TabComponents/District.tsx
@@ -0,0 +1,3 @@
+export function District() {
+  return <div>- District</div>
+}
diff --git a/components/legislator/TabComponents/Elections.tsx b/components/legislator/TabComponents/Elections.tsx
new file mode 100644
index 000000000..c20356658
--- /dev/null
+++ b/components/legislator/TabComponents/Elections.tsx
@@ -0,0 +1,3 @@
+export function Elections() {
+  return <div>- Elections</div>
+}
diff --git a/components/legislator/TabComponents/Finance.tsx b/components/legislator/TabComponents/Finance.tsx
new file mode 100644
index 000000000..f1431f05f
--- /dev/null
+++ b/components/legislator/TabComponents/Finance.tsx
@@ -0,0 +1,3 @@
+export function Finance() {
+  return <div>- Finance</div>
+}
diff --git a/components/legislator/TabComponents/LegislatorTabs.tsx b/components/legislator/TabComponents/LegislatorTabs.tsx
new file mode 100644
index 000000000..5feb3558c
--- /dev/null
+++ b/components/legislator/TabComponents/LegislatorTabs.tsx
@@ -0,0 +1,130 @@
+import { useTranslation } from "next-i18next"
+import { TabPane } from "react-bootstrap"
+import TabContainer from "react-bootstrap/TabContainer"
+
+import { Container, Nav, Row, Spinner } from "../../bootstrap"
+
+import { Bills } from "./Bills"
+import { District } from "./District"
+import { Elections } from "./Elections"
+import { Finance } from "./Finance"
+import { Priorities } from "./Priorities"
+import { Testimony } from "./Testimony"
+import { Votes } from "./Votes"
+
+import {
+  StyledTabContent,
+  TabNavWrapper
+} from "components/EditProfilePage/StyledEditProfileComponents"
+
+import styled from "styled-components"
+
+const tabCategory = [
+  "priorities",
+  "bills",
+  "elections",
+  "finance",
+  "district",
+  "testimony",
+  "votes"
+]
+type TabCategories = (typeof tabCategory)[number]
+
+export function LegislatorTabs({
+  tabCategory
+}: {
+  tabCategory?: TabCategories
+}) {
+  const { t } = useTranslation("legislators")
+
+  const tabs = [
+    {
+      title: t("tabs.priorities"),
+      eventKey: "priorities",
+      content: <Priorities />
+    },
+    {
+      title: t("tabs.bills"),
+      eventKey: "bills",
+      content: <Bills />
+    },
+    {
+      title: t("tabs.elections"),
+      eventKey: "elections",
+      content: <Elections />
+    },
+    {
+      title: t("tabs.finance"),
+      eventKey: "finance",
+      content: <Finance />
+    },
+    {
+      title: t("tabs.district"),
+      eventKey: "district",
+      content: <District />
+    },
+    {
+      title: t("tabs.testimony"),
+      eventKey: "testimony",
+      content: <Testimony />
+    },
+    {
+      title: t("tabs.votes"),
+      eventKey: "votes",
+      content: <Votes />
+    }
+  ]
+
+  return (
+    <Container>
+      <TabContainer defaultActiveKey="priorities" activeKey={tabCategory}>
+        <TabNavWrapper>
+          {tabs.map((t, i) => (
+            <TabNavItem key={i} tab={t} i={i} />
+          ))}
+        </TabNavWrapper>
+        <StyledTabContent>
+          {tabs.map(t => (
+            <TabPane key={t.eventKey} title={t.title} eventKey={t.eventKey}>
+              {t.content}
+            </TabPane>
+          ))}
+        </StyledTabContent>
+      </TabContainer>
+    </Container>
+  )
+}
+
+type TabType = { title: string; eventKey: string; content: JSX.Element }
+
+const TabNavLink = styled(Nav.Link).attrs(props => ({
+  className: `rounded-top m-0 p-0 ${props.className}`
+}))`
+  color: #6c757d;
+
+  &.active {
+    color: #1a3185;
+    font-weight: bold;
+  }
+`
+
+const TabNavItem = ({
+  tab,
+  i: i,
+  className
+}: {
+  tab: TabType
+  i: number
+  className?: string
+}) => {
+  return (
+    <Nav.Item className={`flex-lg-fill ${className}`} key={tab.eventKey}>
+      <TabNavLink eventKey={tab.eventKey} className={`rounded-top m-0 p-0`}>
+        <p className={`fs-6 my-0 text-nowrap ${i === 0 ? "" : "mx-4"}`}>
+          {tab.title}
+        </p>
+        <hr className={`my-0`} />
+      </TabNavLink>
+    </Nav.Item>
+  )
+}
diff --git a/components/legislator/TabComponents/Priorities.tsx b/components/legislator/TabComponents/Priorities.tsx
new file mode 100644
index 000000000..534f54540
--- /dev/null
+++ b/components/legislator/TabComponents/Priorities.tsx
@@ -0,0 +1,3 @@
+export function Priorities() {
+  return <div>- Priorities</div>
+}
diff --git a/components/legislator/TabComponents/Testimony.tsx b/components/legislator/TabComponents/Testimony.tsx
new file mode 100644
index 000000000..d69dde353
--- /dev/null
+++ b/components/legislator/TabComponents/Testimony.tsx
@@ -0,0 +1,3 @@
+export function Testimony() {
+  return <div>- Testimony</div>
+}
diff --git a/components/legislator/TabComponents/Votes.tsx b/components/legislator/TabComponents/Votes.tsx
new file mode 100644
index 000000000..ecdfb5f01
--- /dev/null
+++ b/components/legislator/TabComponents/Votes.tsx
@@ -0,0 +1,3 @@
+export function Votes() {
+  return <div>- Votes</div>
+}
diff --git a/components/legislator/index.ts b/components/legislator/index.ts
new file mode 100644
index 000000000..13355a639
--- /dev/null
+++ b/components/legislator/index.ts
@@ -0,0 +1 @@
+export * from "./LegislatorPage"
diff --git a/pages/hearing/[hearingId].tsx b/pages/hearing/[hearingId].tsx
index 84263d4e1..46431a13e 100644
--- a/pages/hearing/[hearingId].tsx
+++ b/pages/hearing/[hearingId].tsx
@@ -9,7 +9,7 @@ import { fetchHearingData, HearingData } from "components/hearing/hearing"
 const Query = z.object({ hearingId: z.coerce.number() })
 
 export default createPage<{ hearingData: HearingData }>({
-  titleI18nKey: "Hearing",
+  titleI18nKey: "navigation.hearing",
   Page: ({ hearingData }) => {
     return <HearingDetails hearingData={hearingData} />
   }
diff --git a/pages/legislators/profile.tsx b/pages/legislators/profile.tsx
new file mode 100644
index 000000000..83858d53b
--- /dev/null
+++ b/pages/legislators/profile.tsx
@@ -0,0 +1,72 @@
+import { useTranslation } from "next-i18next"
+import { useEffect, useState } from "react"
+import { Spinner } from "react-bootstrap"
+
+import { useAuth } from "components/auth"
+import { LegislatorPage } from "components/legislator"
+import { createPage } from "components/page"
+import { createGetStaticTranslationProps } from "components/translations"
+
+export default createPage({
+  titleI18nKey: "navigation.legislator",
+  Page: () => {
+    const { id, loading } = useProfileRouting()
+    const { authenticated, user } = useAuth()
+    const { t } = useTranslation("profile")
+
+    return (
+      <div>
+        {loading ? (
+          <div className={`d-grid place-content-center`}>
+            <Spinner animation={"border"} />
+          </div>
+        ) : !loading && !id && authenticated ? (
+          <LegislatorPage id={user!.uid} />
+        ) : id ? (
+          <LegislatorPage id={id} />
+        ) : (
+          <div>{t("noUser")}</div>
+        )}
+      </div>
+    )
+  }
+})
+
+const useProfileRouting = () => {
+  const { user } = useAuth()
+
+  const [id, setId] = useState<string>("od")
+  const [loading, setLoading] = useState<boolean>(true)
+
+  useEffect(() => {
+    if (window) {
+      const urlParams = new URLSearchParams(window.location?.search)
+      const urlid = urlParams.get("id")
+
+      if (urlid === null) {
+        if (user?.uid) {
+          setId(user.uid)
+          urlParams.set("id", user.uid)
+        }
+      }
+
+      if (typeof urlid === "string") {
+        setId(urlid)
+      }
+      if (urlid !== undefined) {
+        setLoading(false)
+      }
+    }
+  }, [id, user?.uid])
+
+  return { id, loading }
+}
+
+export const getStaticProps = createGetStaticTranslationProps([
+  "auth",
+  "common",
+  "footer",
+  "legislators",
+  "profile",
+  "testimony"
+])
diff --git a/public/locales/en/common.json b/public/locales/en/common.json
index 209b85ac4..3dda1fe62 100644
--- a/public/locales/en/common.json
+++ b/public/locales/en/common.json
@@ -119,10 +119,12 @@
     "editProfile": "Edit Profile",
     "faq": "FAQ",
     "followingTab": "Followed Content",
+    "hearing": "Hearing",
     "hearings": "Hearings",
     "home": "Home",
     "learnAboutTestimony": "Learn About Testimony",
     "legislativeProcess": "About the MA Legislative Process",
+    "legislator": "Legislator",
     "logo": "Massachusetts Platform for Legislative Engagement home",
     "main": "Main navigation",
     "missionAndGoals": "Mission & Goals",
diff --git a/public/locales/en/legislators.json b/public/locales/en/legislators.json
new file mode 100644
index 000000000..8e4b72d3d
--- /dev/null
+++ b/public/locales/en/legislators.json
@@ -0,0 +1,15 @@
+{
+  "home": "Home",
+  "legislators": "Legislators",
+  "tabs": {
+    "bills": "Bills",
+    "district": "District",
+    "elections": "Elections",
+    "finance": "Finance",
+    "priorities": "Priorities",
+    "testimony": "Testimony",
+    "votes": "Votes"
+  },
+  "test": "Test",
+  "test2": "Hello World"    
+}
\ No newline at end of file