boxicons

import * as React from "react";

function BoxiconsAtom(props) {
  return (
    <svg xmlns="http://www.w3.org/2000/svg" width={24} height={24} {...props}>
      <path d="M3.102 20.898c.698.699 1.696 1.068 2.887 1.068 1.742 0 3.855-.778 6.012-2.127 2.156 1.35 4.27 2.127 6.012 2.127 1.19 0 2.188-.369 2.887-1.068 1.269-1.269 1.411-3.413.401-6.039-.358-.932-.854-1.895-1.457-2.859a16.792 16.792 0 001.457-2.859c1.01-2.626.867-4.771-.401-6.039-.698-.699-1.696-1.068-2.887-1.068-1.742 0-3.855.778-6.012 2.127-2.156-1.35-4.27-2.127-6.012-2.127-1.19 0-2.188.369-2.887 1.068C1.833 4.371 1.69 6.515 2.7 9.141c.359.932.854 1.895 1.457 2.859A16.792 16.792 0 002.7 14.859c-1.01 2.626-.867 4.77.402 6.039zm16.331-5.321c.689 1.79.708 3.251.052 3.907-.32.32-.815.482-1.473.482-1.167 0-2.646-.503-4.208-1.38a26.611 26.611 0 004.783-4.784c.336.601.623 1.196.846 1.775zM12 17.417a23.568 23.568 0 01-2.934-2.483A23.998 23.998 0 016.566 12 23.74 23.74 0 0112 6.583a23.568 23.568 0 012.934 2.483 23.998 23.998 0 012.5 2.934A23.74 23.74 0 0112 17.417zm6.012-13.383c.657 0 1.152.162 1.473.482.656.656.638 2.117-.052 3.907-.223.579-.51 1.174-.846 1.775a26.448 26.448 0 00-4.783-4.784c1.562-.876 3.041-1.38 4.208-1.38zM4.567 8.423c-.689-1.79-.708-3.251-.052-3.907.32-.32.815-.482 1.473-.482 1.167 0 2.646.503 4.208 1.38a26.448 26.448 0 00-4.783 4.784 13.934 13.934 0 01-.846-1.775zm0 7.154c.223-.579.51-1.174.846-1.775a26.448 26.448 0 004.783 4.784c-1.563.877-3.041 1.38-4.208 1.38-.657 0-1.152-.162-1.473-.482-.656-.656-.637-2.117.052-3.907z" />
      <circle cx={12} cy={12} r={2.574} />
    </svg>
  );
}

export default BoxiconsAtom;


import * as React from "react";

function BoxiconsAtom(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg xmlns="http://www.w3.org/2000/svg" width={24} height={24} {...props}>
      <path d="M3.102 20.898c.698.699 1.696 1.068 2.887 1.068 1.742 0 3.855-.778 6.012-2.127 2.156 1.35 4.27 2.127 6.012 2.127 1.19 0 2.188-.369 2.887-1.068 1.269-1.269 1.411-3.413.401-6.039-.358-.932-.854-1.895-1.457-2.859a16.792 16.792 0 001.457-2.859c1.01-2.626.867-4.771-.401-6.039-.698-.699-1.696-1.068-2.887-1.068-1.742 0-3.855.778-6.012 2.127-2.156-1.35-4.27-2.127-6.012-2.127-1.19 0-2.188.369-2.887 1.068C1.833 4.371 1.69 6.515 2.7 9.141c.359.932.854 1.895 1.457 2.859A16.792 16.792 0 002.7 14.859c-1.01 2.626-.867 4.77.402 6.039zm16.331-5.321c.689 1.79.708 3.251.052 3.907-.32.32-.815.482-1.473.482-1.167 0-2.646-.503-4.208-1.38a26.611 26.611 0 004.783-4.784c.336.601.623 1.196.846 1.775zM12 17.417a23.568 23.568 0 01-2.934-2.483A23.998 23.998 0 016.566 12 23.74 23.74 0 0112 6.583a23.568 23.568 0 012.934 2.483 23.998 23.998 0 012.5 2.934A23.74 23.74 0 0112 17.417zm6.012-13.383c.657 0 1.152.162 1.473.482.656.656.638 2.117-.052 3.907-.223.579-.51 1.174-.846 1.775a26.448 26.448 0 00-4.783-4.784c1.562-.876 3.041-1.38 4.208-1.38zM4.567 8.423c-.689-1.79-.708-3.251-.052-3.907.32-.32.815-.482 1.473-.482 1.167 0 2.646.503 4.208 1.38a26.448 26.448 0 00-4.783 4.784 13.934 13.934 0 01-.846-1.775zm0 7.154c.223-.579.51-1.174.846-1.775a26.448 26.448 0 004.783 4.784c-1.563.877-3.041 1.38-4.208 1.38-.657 0-1.152-.162-1.473-.482-.656-.656-.637-2.117.052-3.907z" />
      <circle cx={12} cy={12} r={2.574} />
    </svg>
  );
}

export default BoxiconsAtom;


import * as React from "react";
import Svg, { Path, Circle } from "react-native-svg";

function BoxiconsAtom(props) {
  return (
    <Svg xmlns="http://www.w3.org/2000/svg" width={24} height={24} {...props}>
      <Path d="M3.102 20.898c.698.699 1.696 1.068 2.887 1.068 1.742 0 3.855-.778 6.012-2.127 2.156 1.35 4.27 2.127 6.012 2.127 1.19 0 2.188-.369 2.887-1.068 1.269-1.269 1.411-3.413.401-6.039-.358-.932-.854-1.895-1.457-2.859a16.792 16.792 0 001.457-2.859c1.01-2.626.867-4.771-.401-6.039-.698-.699-1.696-1.068-2.887-1.068-1.742 0-3.855.778-6.012 2.127-2.156-1.35-4.27-2.127-6.012-2.127-1.19 0-2.188.369-2.887 1.068C1.833 4.371 1.69 6.515 2.7 9.141c.359.932.854 1.895 1.457 2.859A16.792 16.792 0 002.7 14.859c-1.01 2.626-.867 4.77.402 6.039zm16.331-5.321c.689 1.79.708 3.251.052 3.907-.32.32-.815.482-1.473.482-1.167 0-2.646-.503-4.208-1.38a26.611 26.611 0 004.783-4.784c.336.601.623 1.196.846 1.775zM12 17.417a23.568 23.568 0 01-2.934-2.483A23.998 23.998 0 016.566 12 23.74 23.74 0 0112 6.583a23.568 23.568 0 012.934 2.483 23.998 23.998 0 012.5 2.934A23.74 23.74 0 0112 17.417zm6.012-13.383c.657 0 1.152.162 1.473.482.656.656.638 2.117-.052 3.907-.223.579-.51 1.174-.846 1.775a26.448 26.448 0 00-4.783-4.784c1.562-.876 3.041-1.38 4.208-1.38zM4.567 8.423c-.689-1.79-.708-3.251-.052-3.907.32-.32.815-.482 1.473-.482 1.167 0 2.646.503 4.208 1.38a26.448 26.448 0 00-4.783 4.784 13.934 13.934 0 01-.846-1.775zm0 7.154c.223-.579.51-1.174.846-1.775a26.448 26.448 0 004.783 4.784c-1.563.877-3.041 1.38-4.208 1.38-.657 0-1.152-.162-1.473-.482-.656-.656-.637-2.117.052-3.907z" />
      <Circle cx={12} cy={12} r={2.574} />
    </Svg>
  );
}

export default BoxiconsAtom;


import * as React from "react";
import Svg, { SvgProps, Path, Circle } from "react-native-svg";

function BoxiconsAtom(props: SvgProps) {
  return (
    <Svg xmlns="http://www.w3.org/2000/svg" width={24} height={24} {...props}>
      <Path d="M3.102 20.898c.698.699 1.696 1.068 2.887 1.068 1.742 0 3.855-.778 6.012-2.127 2.156 1.35 4.27 2.127 6.012 2.127 1.19 0 2.188-.369 2.887-1.068 1.269-1.269 1.411-3.413.401-6.039-.358-.932-.854-1.895-1.457-2.859a16.792 16.792 0 001.457-2.859c1.01-2.626.867-4.771-.401-6.039-.698-.699-1.696-1.068-2.887-1.068-1.742 0-3.855.778-6.012 2.127-2.156-1.35-4.27-2.127-6.012-2.127-1.19 0-2.188.369-2.887 1.068C1.833 4.371 1.69 6.515 2.7 9.141c.359.932.854 1.895 1.457 2.859A16.792 16.792 0 002.7 14.859c-1.01 2.626-.867 4.77.402 6.039zm16.331-5.321c.689 1.79.708 3.251.052 3.907-.32.32-.815.482-1.473.482-1.167 0-2.646-.503-4.208-1.38a26.611 26.611 0 004.783-4.784c.336.601.623 1.196.846 1.775zM12 17.417a23.568 23.568 0 01-2.934-2.483A23.998 23.998 0 016.566 12 23.74 23.74 0 0112 6.583a23.568 23.568 0 012.934 2.483 23.998 23.998 0 012.5 2.934A23.74 23.74 0 0112 17.417zm6.012-13.383c.657 0 1.152.162 1.473.482.656.656.638 2.117-.052 3.907-.223.579-.51 1.174-.846 1.775a26.448 26.448 0 00-4.783-4.784c1.562-.876 3.041-1.38 4.208-1.38zM4.567 8.423c-.689-1.79-.708-3.251-.052-3.907.32-.32.815-.482 1.473-.482 1.167 0 2.646.503 4.208 1.38a26.448 26.448 0 00-4.783 4.784 13.934 13.934 0 01-.846-1.775zm0 7.154c.223-.579.51-1.174.846-1.775a26.448 26.448 0 004.783 4.784c-1.563.877-3.041 1.38-4.208 1.38-.657 0-1.152-.162-1.473-.482-.656-.656-.637-2.117.052-3.907z" />
      <Circle cx={12} cy={12} r={2.574} />
    </Svg>
  );
}

export default BoxiconsAtom;


import styled, { css } from 'styled-components';

import styled, { css } from "styled-components";

const SvgIcon = (props) =>
  ((props) => (
    <svg xmlns="http://www.w3.org/2000/svg" width={24} height={24} {...props}>
      <path d="M3.102 20.898c.698.699 1.696 1.068 2.887 1.068 1.742 0 3.855-.778 6.012-2.127 2.156 1.35 4.27 2.127 6.012 2.127 1.19 0 2.188-.369 2.887-1.068 1.269-1.269 1.411-3.413.401-6.039-.358-.932-.854-1.895-1.457-2.859a16.792 16.792 0 001.457-2.859c1.01-2.626.867-4.771-.401-6.039-.698-.699-1.696-1.068-2.887-1.068-1.742 0-3.855.778-6.012 2.127-2.156-1.35-4.27-2.127-6.012-2.127-1.19 0-2.188.369-2.887 1.068C1.833 4.371 1.69 6.515 2.7 9.141c.359.932.854 1.895 1.457 2.859A16.792 16.792 0 002.7 14.859c-1.01 2.626-.867 4.77.402 6.039zm16.331-5.321c.689 1.79.708 3.251.052 3.907-.32.32-.815.482-1.473.482-1.167 0-2.646-.503-4.208-1.38a26.611 26.611 0 004.783-4.784c.336.601.623 1.196.846 1.775zM12 17.417a23.568 23.568 0 01-2.934-2.483A23.998 23.998 0 016.566 12 23.74 23.74 0 0112 6.583a23.568 23.568 0 012.934 2.483 23.998 23.998 0 012.5 2.934A23.74 23.74 0 0112 17.417zm6.012-13.383c.657 0 1.152.162 1.473.482.656.656.638 2.117-.052 3.907-.223.579-.51 1.174-.846 1.775a26.448 26.448 0 00-4.783-4.784c1.562-.876 3.041-1.38 4.208-1.38zM4.567 8.423c-.689-1.79-.708-3.251-.052-3.907.32-.32.815-.482 1.473-.482 1.167 0 2.646.503 4.208 1.38a26.448 26.448 0 00-4.783 4.784 13.934 13.934 0 01-.846-1.775zm0 7.154c.223-.579.51-1.174.846-1.775a26.448 26.448 0 004.783 4.784c-1.563.877-3.041 1.38-4.208 1.38-.657 0-1.152-.162-1.473-.482-.656-.656-.637-2.117.052-3.907z" />
      <circle cx={12} cy={12} r={2.574} />
    </svg>
  ))({
    className: props.className,
  });

const StyledBoxiconsAtom = styled(SvgIcon)(
  [],
  ({ theme, fill, width }) => css`
    width: ${width || theme.sizes.width};
    height: ${width || theme.sizes.width};
    fill: ${fill || theme.colors.fillColor};
  `
);
export default StyledBoxiconsAtom;


import styled, { css } from "styled-components";

const SvgIcon = (props: React.SVGProps<SVGSVGElement>) =>
  ((props) => (
    <svg xmlns="http://www.w3.org/2000/svg" width={24} height={24} {...props}>
      <path d="M3.102 20.898c.698.699 1.696 1.068 2.887 1.068 1.742 0 3.855-.778 6.012-2.127 2.156 1.35 4.27 2.127 6.012 2.127 1.19 0 2.188-.369 2.887-1.068 1.269-1.269 1.411-3.413.401-6.039-.358-.932-.854-1.895-1.457-2.859a16.792 16.792 0 001.457-2.859c1.01-2.626.867-4.771-.401-6.039-.698-.699-1.696-1.068-2.887-1.068-1.742 0-3.855.778-6.012 2.127-2.156-1.35-4.27-2.127-6.012-2.127-1.19 0-2.188.369-2.887 1.068C1.833 4.371 1.69 6.515 2.7 9.141c.359.932.854 1.895 1.457 2.859A16.792 16.792 0 002.7 14.859c-1.01 2.626-.867 4.77.402 6.039zm16.331-5.321c.689 1.79.708 3.251.052 3.907-.32.32-.815.482-1.473.482-1.167 0-2.646-.503-4.208-1.38a26.611 26.611 0 004.783-4.784c.336.601.623 1.196.846 1.775zM12 17.417a23.568 23.568 0 01-2.934-2.483A23.998 23.998 0 016.566 12 23.74 23.74 0 0112 6.583a23.568 23.568 0 012.934 2.483 23.998 23.998 0 012.5 2.934A23.74 23.74 0 0112 17.417zm6.012-13.383c.657 0 1.152.162 1.473.482.656.656.638 2.117-.052 3.907-.223.579-.51 1.174-.846 1.775a26.448 26.448 0 00-4.783-4.784c1.562-.876 3.041-1.38 4.208-1.38zM4.567 8.423c-.689-1.79-.708-3.251-.052-3.907.32-.32.815-.482 1.473-.482 1.167 0 2.646.503 4.208 1.38a26.448 26.448 0 00-4.783 4.784 13.934 13.934 0 01-.846-1.775zm0 7.154c.223-.579.51-1.174.846-1.775a26.448 26.448 0 004.783 4.784c-1.563.877-3.041 1.38-4.208 1.38-.657 0-1.152-.162-1.473-.482-.656-.656-.637-2.117.052-3.907z" />
      <circle cx={12} cy={12} r={2.574} />
    </svg>
  ))({
    className: props.className,
  });

const StyledBoxiconsAtom = styled(SvgIcon)(
  [],
  ({ theme, fill, width }) => css`
    width: ${width || theme.sizes.width};
    height: ${width || theme.sizes.width};
    fill: ${fill || theme.colors.fillColor};
  `
);
export default StyledBoxiconsAtom;
