Breakpoints

Grid layout related settings

const Box = styled.div`
    display: none;

    ${media.xl`
        display: flex;
    `}
`;

Tip

But what should I do if the IDE cannot check CSS style errors?

You can install Webstorm / Styled Component & Styled JSX plugins

Webstorm

Search Plugins and Install

in Languages & Frameworks > Javascript > Styled Components

add media

then check!