diff --git a/src/components/radio-button/index.js b/src/components/radio-button/index.js
index b4813578a..4b8bb8861 100644
--- a/src/components/radio-button/index.js
+++ b/src/components/radio-button/index.js
@@ -45,7 +45,7 @@ const RadioButton = ({
       <IconContainer
         background={radioStyles.containerColor}
         borderColor={radioStyles.borderColor}
-        margin={children || label ? [0, 2, 0, 0] : null}
+        margin={children || label ? [0.5, 2, 0, 0] : null}
       >
         {showIcon && <StyledIcon name="dot" color={radioStyles.dotColor} {...iconProps} />}
       </IconContainer>
diff --git a/src/components/radio-button/styled.js b/src/components/radio-button/styled.js
index 2c0805049..33805df8c 100644
--- a/src/components/radio-button/styled.js
+++ b/src/components/radio-button/styled.js
@@ -35,8 +35,8 @@ export const IconContainer = styled.div`
   overflow: hidden;
   flex: 0 0 auto;
 
-  height: 20px;
-  width: 20px;
+  height: 16px;
+  width: 16px;
 
   box-sizing: border-box;
   border: 1px solid ${props => getColor(props.borderColor)(props)};
@@ -47,6 +47,6 @@ export const IconContainer = styled.div`
 `
 export const StyledIcon = styled(Icon)`
   fill: ${props => getColor(props.color)(props)};
-  height: 10px;
-  width: 10px;
+  height: 8px;
+  width: 8px;
 `