diff --git a/protocol-designer/src/assets/localization/en/shared.json b/protocol-designer/src/assets/localization/en/shared.json
index fcf63f043da..812c7b1ef03 100644
--- a/protocol-designer/src/assets/localization/en/shared.json
+++ b/protocol-designer/src/assets/localization/en/shared.json
@@ -79,6 +79,7 @@
   "message_uses_standard_namespace": "This labware definition uses the Opentrons standard labware namespace. Change the namespace if it is custom, or use the standard labware in your protocol.",
   "mismatched": "The new labware has a different arrangement of wells than the labware it is replacing. Clicking Overwrite will deselect all wells in any existing steps that use this labware. You will have to edit each of those steps and select new wells.",
   "module": "Module",
+  "name_step": "Name step",
   "next": "next",
   "ninety_six_channel": "96-Channel",
   "no_hints_to_restore": "No hints to restore",
diff --git a/protocol-designer/src/organisms/RenameStepModal/index.tsx b/protocol-designer/src/organisms/RenameStepModal/index.tsx
new file mode 100644
index 00000000000..b7fd9df3269
--- /dev/null
+++ b/protocol-designer/src/organisms/RenameStepModal/index.tsx
@@ -0,0 +1,109 @@
+import { useState } from 'react'
+import { useDispatch, useSelector } from 'react-redux'
+import { useTranslation } from 'react-i18next'
+import { createPortal } from 'react-dom'
+import styled from 'styled-components'
+import {
+  BORDERS,
+  COLORS,
+  DIRECTION_COLUMN,
+  Flex,
+  JUSTIFY_END,
+  Modal,
+  PrimaryButton,
+  SecondaryButton,
+  SPACING,
+  StyledText,
+  TYPOGRAPHY,
+  InputField,
+} from '@opentrons/components'
+import { i18n } from '../../assets/localization'
+import { getTopPortalEl } from '../../components/portals/TopPortal'
+import type { FormData } from '../../form-types'
+
+interface RenameStepModalProps {
+  formData: FormData
+  onClose: () => void
+}
+export function RenameStepModal(props: RenameStepModalProps): JSX.Element {
+  const { onClose, formData } = props
+  const dispatch = useDispatch()
+  const { t } = useTranslation(['form', 'shared'])
+  const [stepName, setStepName] = useState<string>('')
+
+  //   const saveRenameStep = (nextFormValues: FileMetadataFields): void => {
+  //     dispatch(actions.saveFileMetadata(nextFormValues))
+  //     onClose()
+  //   }
+  //   const handleSave = (): void => {
+  //     dispatch()
+  //     close()
+  //   }
+
+  return createPortal(
+    <Modal
+      title={t('shared:name_step')}
+      type="info"
+      closeOnOutsideClick
+      onClose={onClose}
+      childrenPadding={SPACING.spacing24}
+      footer={
+        <Flex
+          justifyContent={JUSTIFY_END}
+          padding={`0 ${SPACING.spacing24} ${SPACING.spacing24}`}
+          gridGap={SPACING.spacing8}
+        >
+          <SecondaryButton onClick={onClose}>
+            {t('shared:cancel')}
+          </SecondaryButton>
+          <PrimaryButton
+            data-testid="RenameStepModal_saveButton"
+            disabled={false}
+            onClick={() => {
+              //   handleSubmit(saveFileMetadata)()
+            }}
+          >
+            {t('shared:save')}
+          </PrimaryButton>
+        </Flex>
+      }
+    >
+      <form>
+        <Flex flexDirection={DIRECTION_COLUMN} gridGap={SPACING.spacing12}>
+          <Flex flexDirection={DIRECTION_COLUMN} gridGap={SPACING.spacing4}>
+            <StyledText color={COLORS.grey60} desktopStyle="captionRegular">
+              {t('form:step_edit_form.field.step_name.label')}
+            </StyledText>
+            <InputField
+              placeholder={i18n.format(t(formData.stepName), 'capitalize')}
+              value={stepName}
+              autoFocus
+              name="StepName"
+              onChange={e => {
+                setStepName(e.target.value)
+              }}
+            />
+          </Flex>
+          <Flex flexDirection={DIRECTION_COLUMN} gridGap={SPACING.spacing4}>
+            <StyledText color={COLORS.grey60} desktopStyle="captionRegular">
+              {t('form:step_edit_form.field.step_notes.label')}
+            </StyledText>
+
+            <DescriptionField />
+          </Flex>
+        </Flex>
+      </form>
+    </Modal>,
+    getTopPortalEl()
+  )
+}
+
+const DescriptionField = styled.textarea`
+  min-height: 5rem;
+  width: 100%;
+  border: ${BORDERS.lineBorder};
+  border-radius: ${BORDERS.borderRadius4};
+  padding: ${SPACING.spacing8};
+  font-size: ${TYPOGRAPHY.fontSizeH3};
+  resize: none;
+`
diff --git a/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/StepFormToolbox.tsx b/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/StepFormToolbox.tsx
index b3236eb1e0e..c9f8f1e593d 100644
--- a/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/StepFormToolbox.tsx
+++ b/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/StepFormToolbox.tsx
@@ -9,6 +9,7 @@ import {
   COLORS,
   Flex,
   Icon,
+  Modal,
   PrimaryButton,
   SPACING,
   SecondaryButton,
@@ -37,6 +38,7 @@ import {
 import { getSaveStepSnackbarText } from './utils'
 import type { StepFieldName } from '../../../../steplist/fieldLevel'
 import type { FormData, StepType } from '../../../../form-types'
+import { RenameStepModal } from '../../../../organisms/RenameStepModal'
 import type { FieldPropsByName, FocusHandlers, StepFormProps } from './types'
 
 type StepFormMap = {
@@ -97,6 +99,7 @@ export function StepFormToolbox(props: StepFormToolboxProps): JSX.Element {
       ? 1
       : 0
   )
+  const [isRename, setIsRename] = useState<boolean>(false)
   const icon = stepIconsByType[formData.stepType]
 
   const ToolsComponent: typeof STEP_FORM_MAP[keyof typeof STEP_FORM_MAP] = get(
@@ -136,8 +139,17 @@ export function StepFormToolbox(props: StepFormToolboxProps): JSX.Element {
       }) as string
     )
   }
+
   return (
     <>
+      {isRename ? (
+        <RenameStepModal
+          formData={formData}
+          onClose={() => {
+            setIsRename(false)
+          }}
+        />
+      ) : null}
       <Toolbox
         subHeader={
           isMultiStepToolbox ? (
@@ -149,7 +161,7 @@ export function StepFormToolbox(props: StepFormToolboxProps): JSX.Element {
         secondaryHeaderButton={
           <Btn
             onClick={() => {
-              console.log('TODO: wire this up')
+              setIsRename(true)
             }}
             css={BUTTON_LINK_STYLE}
             textDecoration={TYPOGRAPHY.textDecorationUnderline}
diff --git a/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/StepTools/MagnetTools/index.tsx b/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/StepTools/MagnetTools/index.tsx
index e32bbd860fb..e536bc750be 100644
--- a/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/StepTools/MagnetTools/index.tsx
+++ b/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/StepTools/MagnetTools/index.tsx
@@ -42,8 +42,6 @@ export function MagnetTools(props: StepFormProps): JSX.Element {
   const deckSetup = useSelector(getInitialDeckSetup)
   const modulesOnDeck = getModulesOnDeckByType(deckSetup, MAGNETIC_MODULE_TYPE)
 
-  console.log(modulesOnDeck)
-
   const moduleModel = moduleEntities[formData.moduleId].model
 
   const slotInfo = moduleLabwareOptions[0].name.split('in')