---
title: Social Icon Block
description: "To customize the Social Icon Block, you can use the below settings: - **General** - **Select Icon:** Select the icon you want to display. - **Width:** Adjust the width of the icon. - **Border:** Adjust the width, style, and color…"
url: "https://spiceblocks.com/docs/social-icon-block/"
updated: "2023-02-21"
category: Blocks Customization
---

# Social Icon Block

To customize the Social Icon Block, you can use the below settings:

- **General**
  - **Select Icon:** Select the icon you want to display.
  - **Width:** Adjust the width of the icon.
  - **Border:** Adjust the width, style, and color of the icon border.
  - **Border Radius:** Adjust the border radius of the icon.
  - **Link:** Enter the navigation link that will be redirected after clicking on the icon.
  - **Open in new Tab:** Enable this option to open a page in a new browser tab.
  - **Icon Margin:** Adjust the margin of the icon.
  - **Padding:** Adjust the padding of the icon.
  - **Animation Effects:** Set the animation effects with multiple options like Fade, Bounce, Swing, etc on the Progress bar.
  - **Display:** Hide/Show the Social Icon individually from a desktop, tablet, or mobile.

- **Box Shadow**
  - Adjust the shadow of the Social Icon using **Horizontal, Vertical, and Blur** Shadow options.
  - Set the color of the box shadow using the **Box Shadow Color** option.

- **Color & Background**
  - Change the normal and hover color of the Social Icon and background.

 ![](https://spiceblocks.com/wp-content/uploads/2022/12/social-icons-block.gif)