diff --git a/src/Checkbox.tsx b/src/Checkbox.tsx
index a49fe11e..34118163 100644
--- a/src/Checkbox.tsx
+++ b/src/Checkbox.tsx
@@ -9,8 +9,8 @@ import { Box, Flex, IBox, useTheme } from './';
 export const Checkbox: FunctionComponent<ICheckbox> = props => {
   const { id, disabled: isDisabled, onChange, ...rest } = props;
 
-  const [checked, setValue] = useState<boolean>(props.checked || false);
-  const isChecked = props.hasOwnProperty('checked') ? props.checked : checked;
+  const [checked, setValue] = useState<boolean>(!!props.checked);
+  const isChecked = props.hasOwnProperty('checked') ? !!props.checked : checked;
 
   const css = checkboxStyles({ isDisabled, isChecked });
 
@@ -44,6 +44,7 @@ export const Checkbox: FunctionComponent<ICheckbox> = props => {
 
 export interface ICheckboxProps {
   id: IBox['id'];
+  checked?: boolean;
   onChange?: (checked: boolean) => void;
 }
 
diff --git a/src/Toggle.tsx b/src/Toggle.tsx
index 33bc1ce6..20b25c70 100644
--- a/src/Toggle.tsx
+++ b/src/Toggle.tsx
@@ -35,8 +35,8 @@ const circleStyles = ({ isChecked }: IToggleCircleProps) => {
 export const Toggle: FunctionComponent<IToggle> = props => {
   const { id, disabled: isDisabled, onChange, ...rest } = props;
 
-  const [checked, setValue] = useState<boolean>(props.checked || false);
-  const isChecked = props.hasOwnProperty('checked') ? props.checked : checked;
+  const [checked, setValue] = useState<boolean>(!!props.checked);
+  const isChecked = props.hasOwnProperty('checked') ? !!props.checked : checked;
 
   const css = toggleStyles({ isDisabled, isChecked });
 
@@ -64,6 +64,7 @@ export const Toggle: FunctionComponent<IToggle> = props => {
 };
 
 export interface IToggleProps {
+  checked?: boolean;
   onChange?: (checked: boolean) => void;
 }