ferris-wheel
Customize icon
Set your custom size or color and download the icon as SVG or PNG image.
Width
Height
Color
Get SVG
Get PNG
Embed this icon within HTML
Copy and paste the following SVG code into your HTML file where you want the icon to appear. Then, you can customize the SVG attributes, such as size or color, using inline styling or CSS classes.
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="1em" height="1em">
<path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 20L12 12L16 20L8 20ZM6.2733 16.0266C5.4711 14.8877 5 13.4989 5 12C5 8.13401 8.13401 5 12 5C15.866 5 19 8.13401 19 12C19 13.4557 18.5556 14.8076 17.7952 15.9276M11.5 4.5C11.5 4.22386 11.7239 4 12 4C12.2761 4 12.5 4.22386 12.5 4.5C12.5 4.77614 12.2761 5 12 5C11.7239 5 11.5 4.77614 11.5 4.5ZM4 12C4 11.7239 4.22386 11.5 4.5 11.5C4.77614 11.5 5 11.7239 5 12C5 12.2761 4.77614 12.5 4.5 12.5C4.22386 12.5 4 12.2761 4 12ZM19 12C19 11.7239 19.2239 11.5 19.5 11.5C19.7761 11.5 20 11.7239 20 12C20 12.2761 19.7761 12.5 19.5 12.5C19.2239 12.5 19 12.2761 19 12ZM17 6.5C17 6.22386 17.2239 6 17.5 6C17.7761 6 18 6.22386 18 6.5C18 6.77614 17.7761 7 17.5 7C17.2239 7 17 6.77614 17 6.5ZM6 6.5C6 6.22386 6.22386 6 6.5 6C6.77614 6 7 6.22386 7 6.5C7 6.77614 6.77614 7 6.5 7C6.22386 7 6 6.77614 6 6.5ZM5 12L8 12M6.5 6.5L9 9M12 5L12 8M17.5 6.5L15 9M16 12L19 12" />
<svg/>
Using as a React Component
You can integrate this icon in your React application using our React icons components. First install the package using YARN or NPM:
$ yarn add @josemi-icons/react
Now you can import this icon in your React application
import {FerrisWheelIcon} from "@josemi-icons/react";
Alternatively, if you only need this icon jou can just copy and paste the following component into your React application:
const FerrisWheelIcon = () => (
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="1em" height="1em">
<path fill="none" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M8 20L12 12L16 20L8 20ZM6.2733 16.0266C5.4711 14.8877 5 13.4989 5 12C5 8.13401 8.13401 5 12 5C15.866 5 19 8.13401 19 12C19 13.4557 18.5556 14.8076 17.7952 15.9276M11.5 4.5C11.5 4.22386 11.7239 4 12 4C12.2761 4 12.5 4.22386 12.5 4.5C12.5 4.77614 12.2761 5 12 5C11.7239 5 11.5 4.77614 11.5 4.5ZM4 12C4 11.7239 4.22386 11.5 4.5 11.5C4.77614 11.5 5 11.7239 5 12C5 12.2761 4.77614 12.5 4.5 12.5C4.22386 12.5 4 12.2761 4 12ZM19 12C19 11.7239 19.2239 11.5 19.5 11.5C19.7761 11.5 20 11.7239 20 12C20 12.2761 19.7761 12.5 19.5 12.5C19.2239 12.5 19 12.2761 19 12ZM17 6.5C17 6.22386 17.2239 6 17.5 6C17.7761 6 18 6.22386 18 6.5C18 6.77614 17.7761 7 17.5 7C17.2239 7 17 6.77614 17 6.5ZM6 6.5C6 6.22386 6.22386 6 6.5 6C6.77614 6 7 6.22386 7 6.5C7 6.77614 6.77614 7 6.5 7C6.22386 7 6 6.77614 6 6.5ZM5 12L8 12M6.5 6.5L9 9M12 5L12 8M17.5 6.5L15 9M16 12L19 12" />
</svg>
);
You can now use the icon component in your React application like any other React component.