1) I can directly style multiple components within a file, each having their own style. 2) Since it's in javascript, I can reference JS variables within the fi

1) I can directly style multiple components within a file, each having their own style. 2) Since it's in javascript, I can reference JS variables within the file. I can derive CSS values from props passed into the component: styled.div`color: ${props => props.userColor}` 3) I can extend other styled components' styles - i have a small shared library of central components like buttons, inputs. I can extend those: styled(MyThemedButton)`color: ${props => props.specialColor}` 4) I can use awesome micro-libraries like styled-system to add parameterization to the JSX elements: const Foo = styled.div`${space}`. ... <Foo key='1' mx={1} my={2} />... <Foo key='2' mx={2} my={3} /> 5) I can change the style of every single styled component with a ThemeProvider. styled.div`color: ${props => props.theme.headerColor}` 6) I can see everything related to the component in one single file.