# mergeMix
> Applies `mix` on top of `base`: the utilities of both render as one class, `mix`'s in a later cascade sublayer, so they win whatever selector `base` nests its rule under.
```ts
import { mergeMix } from "@sdxc/u/general";
```
Applies `mix` on top of `base`: the utilities of both render as one class,
`mix`'s in a later cascade sublayer, so they win whatever selector `base`
nests its rule under. Other mixins apply unchanged; with no utility in
`mix`, `base` renders exactly as it would alone.
## Examples
### Basic example
Use `mergeMix(ownMixins, mix)` where a component forwards its caller's `mix`, so a utility the caller passes wins over the component's own for the same property:
```tsx
Updated two minutes ago
Updated two minutes ago
```
```ts
```
## Applying on a state
Wrap the call in a state utility to scope it to one selector.
```ts
u.hover()
```
## Responsive design
Wrap the call in a container query to scope it to one width.
```ts
u.at("md", )
```
## Signature
```ts
u.mergeMix(base: MixInput, mix: MixInput)
```