Usage - "skipping" over null values when using many breakpoints

Love the library so far, any suggestion on how to improve the readability here?

**Define our breakpoints**
```
export const breakpoints = {
xs: 480,
sm: 576,
md: 768,
lg: 992,
xl: 1200,
xxl: 1600,
}
```

**Feed into facepaint**
```
export const mq = facepaint([
`@media(min-width: ${breakpoints.xs}px)`,
`@media(min-width: ${breakpoints.sm}px)`,
`@media(min-width: ${breakpoints.md}px)`,
`@media(min-width: ${breakpoints.lg}px)`,
`@media(min-width: ${breakpoints.xl}px)`,
`@media(min-width: ${breakpoints.xxl}px)`,
])
```

**Usage**
```
mq({
paddingLeft: [
0,
null,
null,
null,
null,
'320px'
],
})
```

In this case I want the paddingLeft to remain 0 until breakpoint `xl`. Typically all I would need to do is use `@media(min-width: ${breakpoints.xl}px)` and be done. How might I reduce the need to liter the code with `null` values, also how might I make it more readable? You must keep the breakpoint order in your head or constantly refer back to the facepaint declaration as the array size expands.

Perhaps a regular media query could be used here instead, but I prefer not to mix/match. Thoughts?