Vue SocialButtons - Soft UI


Social Media Buttons are clickable icons displayed on web pages to allow website visitors to share content on their personal social networking profiles. Our examples provide different styles for creating a social media button.


Use this example to create a simple Facebook social button with text.

Props Information

size'sm''md''lg'Change the SoftSocialButton size.
icon*StringUsed to set icon to the SoftSocialButton component.
iconOnlyboolfalseIf true the SoftSocialButton will have same width andheight values, its useful when using only icon inside the SoftSocialButton component.
socialBtn*'facebook''twitter''instagram''linkedin''pinterest''youtube''github''vimeo''slack''dribbble''reddit''tumblr'whiteUsed to set the background of SoftSocialButton with the same icon brand color.
roundedboolfalseIf true the SoftSocialButton get a rounded or circular shape.
slotnodeThe SoftSocialButton has a default slot that you can pass node or content inside it.

Icon Only Social Button

Use this example to create a simple and versatile Twitter social button with icon (only).

Circular Social Button

Use this example to create a circular Instagram social button with icon (only).