Hover the icon or press Play. Suggested motion: pop. Pick another to preview it and update the animated code:

Radix Icons · RxMixerVertical

Mixer Vertical icon

A free mixer vertical icon from Radix Icons, ready for React. Use it static or animated: both versions are below, copy-paste or one shadcn command away. Sized in em and colored by currentColor.

License: MIT license
Project: icons.radix-ui.com

Download SVG

Install with shadcn

npx shadcn@latest add https://ui.cuelark.com/r/icons/radix/mixer-vertical.json

components/icons/radix-mixer-vertical.tsx

import * as React from "react";

/**
 * Mixer Vertical from Radix Icons (https://icons.radix-ui.com), MIT.
 * Via Cuelark UI: ui.cuelark.com/icons/radix/mixer-vertical. Sized in em, colored by currentColor.
 */
export function RxMixerVerticalIcon(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      aria-hidden="true"
      fill="none"
      viewBox="0 0 15 15"
      stroke="currentColor"
      fill="currentColor"
      strokeWidth="0"
      width="1em"
      height="1em"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M4.5 1C4.74171 1 4.94371 1.17145 4.99023 1.39941L5 1.5V7C5 7.01656 4.99669 7.03268 4.99512 7.04883C6.13869 7.27856 7 8.28878 7 9.5C7 10.7112 6.13859 11.7204 4.99512 11.9502L5 12V13.5L4.99023 13.6006C4.94371 13.8286 4.74171 14 4.5 14C4.25829 14 4.05629 13.8286 4.00977 13.6006L4 13.5V12C4 11.9831 4.00228 11.9666 4.00391 11.9502C2.8609 11.72 2 10.7108 2 9.5C2 8.28911 2.8608 7.27892 4.00391 7.04883L4 7V1.5C4 1.22386 4.22386 1 4.5 1ZM10.5 1C10.7417 1 10.9437 1.17145 10.9902 1.39941L11 1.5V3L10.9951 3.04883C12.1387 3.27856 13 4.28878 13 5.5C13 6.71115 12.1386 7.72039 10.9951 7.9502L11 8V13.5C11 13.7761 10.7761 14 10.5 14C10.2583 14 10.0563 13.8286 10.0098 13.6006L10 13.5V8C10 7.98314 10.0023 7.96662 10.0039 7.9502C8.8609 7.72003 8 6.71082 8 5.5C8 4.28911 8.8608 3.27892 10.0039 3.04883L10 3V1.5C10 1.22386 10.2239 1 10.5 1ZM4.5 8C3.67157 8 3 8.67157 3 9.5C3 10.3284 3.67157 11 4.5 11C5.32843 11 6 10.3284 6 9.5C6 8.67157 5.32843 8 4.5 8ZM10.5 4C9.67157 4 9 4.67157 9 5.5C9 6.32843 9.67157 7 10.5 7C11.3284 7 12 6.32843 12 5.5C12 4.67157 11.3284 4 10.5 4Z"
        fill="currentColor"
      />
    </svg>
  );
}

With react-icons

import { RxMixerVertical } from "react-icons/rx";

export function Example() {
  return <RxMixerVertical className="size-5" />;
}

mixer-vertical.svg

<svg
  fill="none"
  viewBox="0 0 15 15"
  stroke="currentColor"
  fill="currentColor"
  stroke-width="0"
  width="1em"
  height="1em"
  xmlns="http://www.w3.org/2000/svg"
>
  <path
    d="M4.5 1C4.74171 1 4.94371 1.17145 4.99023 1.39941L5 1.5V7C5 7.01656 4.99669 7.03268 4.99512 7.04883C6.13869 7.27856 7 8.28878 7 9.5C7 10.7112 6.13859 11.7204 4.99512 11.9502L5 12V13.5L4.99023 13.6006C4.94371 13.8286 4.74171 14 4.5 14C4.25829 14 4.05629 13.8286 4.00977 13.6006L4 13.5V12C4 11.9831 4.00228 11.9666 4.00391 11.9502C2.8609 11.72 2 10.7108 2 9.5C2 8.28911 2.8608 7.27892 4.00391 7.04883L4 7V1.5C4 1.22386 4.22386 1 4.5 1ZM10.5 1C10.7417 1 10.9437 1.17145 10.9902 1.39941L11 1.5V3L10.9951 3.04883C12.1387 3.27856 13 4.28878 13 5.5C13 6.71115 12.1386 7.72039 10.9951 7.9502L11 8V13.5C11 13.7761 10.7761 14 10.5 14C10.2583 14 10.0563 13.8286 10.0098 13.6006L10 13.5V8C10 7.98314 10.0023 7.96662 10.0039 7.9502C8.8609 7.72003 8 6.71082 8 5.5C8 4.28911 8.8608 3.27892 10.0039 3.04883L10 3V1.5C10 1.22386 10.2239 1 10.5 1ZM4.5 8C3.67157 8 3 8.67157 3 9.5C3 10.3284 3.67157 11 4.5 11C5.32843 11 6 10.3284 6 9.5C6 8.67157 5.32843 8 4.5 8ZM10.5 4C9.67157 4 9 4.67157 9 5.5C9 6.32843 9.67157 7 10.5 7C11.3284 7 12 6.32843 12 5.5C12 4.67157 11.3284 4 10.5 4Z"
    fill="currentColor"
  />
</svg>

Attribution

"Mixer Vertical" icon from Radix Icons (https://icons.radix-ui.com), licensed under MIT license.

Related icons:

Similar Radix Icons icons