diff --git a/change/@fluentui-web-components-2021-01-04-10-54-05-users-v-sedono-fix-margin-focus-overlap-accordion-item.json b/change/@fluentui-web-components-2021-01-04-10-54-05-users-v-sedono-fix-margin-focus-overlap-accordion-item.json
new file mode 100644
index 0000000000000..26658ff31dda1
--- /dev/null
+++ b/change/@fluentui-web-components-2021-01-04-10-54-05-users-v-sedono-fix-margin-focus-overlap-accordion-item.json
@@ -0,0 +1,8 @@
+{
+  "type": "patch",
+  "comment": "add padding for focus overlap of state in accordion item",
+  "packageName": "@fluentui/web-components",
+  "email": "sethdonohue@Admins-MBP.guest.corp.microsoft.com",
+  "dependentChangeType": "patch",
+  "date": "2021-01-04T18:54:05.059Z"
+}
diff --git a/packages/web-components/src/accordion/accordion-item/accordion-item.styles.ts b/packages/web-components/src/accordion/accordion-item/accordion-item.styles.ts
index 1c78249f6841c..6137a9ce8374c 100644
--- a/packages/web-components/src/accordion/accordion-item/accordion-item.styles.ts
+++ b/packages/web-components/src/accordion/accordion-item/accordion-item.styles.ts
@@ -106,6 +106,7 @@ export const AccordionItemStyles = css`
     .start {
         display: flex;
         align-items: center;
+        padding-inline-start: calc(var(--design-unit) * 1px);
         justify-content: center;
         grid-column: 1;
         z-index: 2;