Connection Point icon
icon-park:connection-point
The Connection Point icon (icon-park:connection-point) is a free SVG icon from the IconPark set by ByteDance. It is drawn on a 48 × 48 grid. IconPark icons are released under the Apache 2.0 license, which allows use in personal and commercial projects. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.
- Icon set
- IconPark
- Author
- ByteDance
- License
- Apache-2.0
- Size
- 48 × 48
- Category
- Connect
- Tags
- connectionpoint
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48"><g fill="none" stroke="#000" stroke-linejoin="round" stroke-width="4"><path stroke-linecap="round" d="M5 24L43 24"/><path fill="#2F88FF" d="M28 4H20C18.8954 4 18 4.89543 18 6V14C18 15.1046 18.8954 16 20 16H28C29.1046 16 30 15.1046 30 14V6C30 4.89543 29.1046 4 28 4Z"/><path fill="#2F88FF" d="M16 32H8C6.89543 32 6 32.8954 6 34V42C6 43.1046 6.89543 44 8 44H16C17.1046 44 18 43.1046 18 42V34C18 32.8954 17.1046 32 16 32Z"/><path fill="#2F88FF" d="M40 32H32C30.8954 32 30 32.8954 30 34V42C30 43.1046 30.8954 44 32 44H40C41.1046 44 42 43.1046 42 42V34C42 32.8954 41.1046 32 40 32Z"/><path stroke-linecap="round" d="M24 24V16"/><path stroke-linecap="round" d="M36 32V24"/><path stroke-linecap="round" d="M12 32V24"/></g></svg>
How to use the Connection Point icon
React
import { Icon } from "@iconify/react";
<Icon icon="icon-park:connection-point" width="24" />
Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="icon-park:connection-point" width="24" />
</template>
Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="icon-park:connection-point" width="24" />
Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[icon-park--connection-point]"></span>
UnoCSS
<!-- @unocss/preset-icons + @iconify-json/icon-park -->
<div class="i-icon-park:connection-point"></div>
Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="icon-park:connection-point"></iconify-icon>
HTML image
<img src="https://iconyz.com/api/public/svg/icon-park/connection-point.svg" alt="Connection Point icon" width="24" height="24">
Related icons in IconPark
Connection Point icon in other icon sets
Connection Point icon FAQ
Is the Connection Point icon free for commercial use?
Yes. IconPark icons are released under the Apache 2.0 license, which allows use in personal and commercial projects.
How do I use the Connection Point icon in React?
Install @iconify/react and render <Icon icon="icon-park:connection-point" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Connection Point icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/icon-park/connection-point.svg" alt="Connection Point icon">, or paste the SVG code inline to style it with CSS.
Browse all IconPark icons →
ICONYZ
