diff --git a/packages/web/components/templates/article/ArticleActionsMenu.tsx b/packages/web/components/templates/article/ArticleActionsMenu.tsx
index a1d3f951b..410ae3080 100644
--- a/packages/web/components/templates/article/ArticleActionsMenu.tsx
+++ b/packages/web/components/templates/article/ArticleActionsMenu.tsx
@@ -8,7 +8,7 @@ import { Box, SpanBox } from "../../elements/LayoutPrimitives"
 import { TooltipWrapped } from "../../elements/Tooltip"
 import { styled, theme } from "../../tokens/stitches.config"
 import { EditLabelsControl } from "./EditLabelsControl"
-import { ReaderSettings } from "./ReaderSettingsModal"
+import { ReaderSettingsControl } from "./ReaderSettingsControl"
 
 export type ArticleActionsMenuLayout = 'horizontal' | 'vertical'
 
@@ -80,7 +80,7 @@ export function ArticleActionsMenu(props: ArticleActionsMenuProps): JSX.Element
         </TooltipWrapped>
         }
       >
-        <ReaderSettings userPreferences={preferencesData} articleActionHandler={props.articleActionHandler} />
+        <ReaderSettingsControl userPreferences={preferencesData} articleActionHandler={props.articleActionHandler} />
       </ActionDropdown>
 
       <MenuSeparator layout={props.layout} />
diff --git a/packages/web/components/templates/article/DisplaySettingsModal.tsx b/packages/web/components/templates/article/DisplaySettingsModal.tsx
index b2d3b40ed..c7e0623cb 100644
--- a/packages/web/components/templates/article/DisplaySettingsModal.tsx
+++ b/packages/web/components/templates/article/DisplaySettingsModal.tsx
@@ -11,8 +11,7 @@ import {
 } from '../../elements/ModalPrimitives'
 import { StyledText } from '../../elements/StyledText'
 import { theme } from '../../tokens/stitches.config'
-import { EditLabelsControl } from './EditLabelsControl'
-import { ReaderSettings } from './ReaderSettingsModal'
+import { ReaderSettingsControl } from './ReaderSettingsControl'
 
 type DisplaySettingsModalProps = {
   onOpenChange: (open: boolean) => void
@@ -51,7 +50,7 @@ export function DisplaySettingsModal(props: DisplaySettingsModalProps): JSX.Elem
                 />
               </Button>
           </HStack>
-          <ReaderSettings {...props} />
+          <ReaderSettingsControl {...props} />
         </VStack>
       </ModalContent>
     </ModalRoot>
diff --git a/packages/web/components/templates/article/ReaderSettingsModal.tsx b/packages/web/components/templates/article/ReaderSettingsControl.tsx
similarity index 98%
rename from packages/web/components/templates/article/ReaderSettingsModal.tsx
rename to packages/web/components/templates/article/ReaderSettingsControl.tsx
index 1f435978d..fd1e74004 100644
--- a/packages/web/components/templates/article/ReaderSettingsModal.tsx
+++ b/packages/web/components/templates/article/ReaderSettingsControl.tsx
@@ -9,6 +9,7 @@ import { TickedRangeSlider } from '../../elements/TickedRangeSlider'
 import { UserPreferences } from '../../../lib/networking/queries/useGetUserPreferences'
 import { showSuccessToast } from '../../../lib/toastHelpers'
 
+
 type ReaderSettingsProps = {
   userPreferences?: UserPreferences
   articleActionHandler: (action: string, arg?: number) => void
@@ -20,7 +21,7 @@ const VerticalDivider = styled(SpanBox, {
   background: `${theme.colors.grayLine.toString()}`,
 })
 
-export function ReaderSettings(props: ReaderSettingsProps): JSX.Element {
+export function ReaderSettingsControl(props: ReaderSettingsProps): JSX.Element {
   const [marginWidth, setMarginWidth] = useState(props.userPreferences?.margin ?? 0)
   const [lineHeight, setLineHeight] = useState(props.userPreferences?.lineHeight ?? 150)