Question 59664 in Telegram API Question posted in
A comprehensive official documentation can be found here.

I search source of svg for socials – Telegram API

In custom html/css template I have instagram svg icon, defined as :

<div class="user_info__links">
    <a href="#" class="user_info__links-btn user_info__links-instagram">
        <svg class="icon icon-instagram" viewBox="0 0 21 21" fill="none"
             xmlns="http://www.w3.org/2000/svg">
            <path
                d="M14.8999 0H6.10017C2.73652 0 0 2.73652 0 6.10017V14.8998C0 18.2635 2.73652 21 6.10017 21H14.8998C18.2635 21 21 18.2635 21 14.8999V6.10017C21 2.73652 18.2635 0 14.8999 0ZM19.3594 14.8998C19.3594 17.3588 17.3588 19.3594 14.8999 19.3594H6.10017C3.64116 19.3594 1.64062 17.3588 1.64062 14.8999V6.10017C1.64062 3.64116 3.64116 1.64062 6.10017 1.64062H14.8998C17.3588 1.64062 19.3594 3.64116 19.3594 6.10017V14.8998Z"
                fill="url(#paint0_linear)"/>
            <path
                d="M10.5 4.83984C7.37896 4.83984 4.83984 7.37896 4.83984 10.5C4.83984 13.621 7.37896 16.1602 10.5 16.1602C13.621 16.1602 16.1602 13.621 16.1602 10.5C16.1602 7.37896 13.621 4.83984 10.5 4.83984ZM10.5 14.5195C8.28364 14.5195 6.48047 12.7164 6.48047 10.5C6.48047 8.28364 8.28364 6.48047 10.5 6.48047C12.7164 6.48047 14.5195 8.28364 14.5195 10.5C14.5195 12.7164 12.7164 14.5195 10.5 14.5195Z"
                fill="url(#paint1_linear)"/>
            <path
                d="M16.2422 5.57812C16.6952 5.57812 17.0625 5.21086 17.0625 4.75781C17.0625 4.30477 16.6952 3.9375 16.2422 3.9375C15.7891 3.9375 15.4219 4.30477 15.4219 4.75781C15.4219 5.21086 15.7891 5.57812 16.2422 5.57812Z"
                fill="url(#paint2_linear)"/>
            <defs>
                <linearGradient id="paint0_linear" x1="19" y1="1.5"
                                x2="-1.16229e-06" y2="21"
                                gradientUnits="userSpaceOnUse">
                    <stop stop-color="#AF13A4"/>
                    <stop offset="0.302083" stop-color="#BF0985"/>
                    <stop offset="0.723958" stop-color="#F04815"/>
                    <stop offset="1" stop-color="#FED819"/>
                </linearGradient>
                <linearGradient id="paint1_linear" x1="19" y1="1.5"
                                x2="-1.16229e-06" y2="21"
                                gradientUnits="userSpaceOnUse">
                    <stop stop-color="#AF13A4"/>
                    <stop offset="0.302083" stop-color="#BF0985"/>
                    <stop offset="0.723958" stop-color="#F04815"/>
                    <stop offset="1" stop-color="#FED819"/>
                </linearGradient>
                <linearGradient id="paint2_linear" x1="19" y1="1.5"
                                x2="-1.16229e-06" y2="21"
                                gradientUnits="userSpaceOnUse">
                    <stop stop-color="#AF13A4"/>
                    <stop offset="0.302083" stop-color="#BF0985"/>
                    <stop offset="0.723958" stop-color="#F04815"/>
                    <stop offset="1" stop-color="#FED819"/>
                </linearGradient>
            </defs>
        </svg>
        <span>{{ userProfile.instagram }}</span>
    </a>
</div>

and it looks like : https://prnt.sc/26bfj3j

Now I need similar icons for facebook, twitter, 500px, linkendin, unslplash, telegram, facebook_messenger, viber,
whatsapp, youtube, vk.com

I did not find any similar icons in the app and I do now know a lot about svg format, but I suppose that the icon itself is defined in 3

<path d=

blocks, can be some commonly known source of svg and I can get all icons I got from there…

Any source for rest of svg icons ?

Thanks!

Tags:

2

Answers


  1. 0

    you can just add for him a style property and give it width and height if its not work :
    you can find s good icons from these website:
    heroicons
    flaticons
    feathericons.
    with these links you can search for your icons and just copy svg codes and paste it on you html code

    Login or Signup to reply.
  2. 0

    All of the icons you want are available in FontAwesome.

    You can search through their brand icons here.

    When you find an icon you want. Click on the icon. Then in the dialog that pops up, click on the "Copy SVG code" button ( </> ). There’s also a button to download the SVG.

    If you use these FontAwesome icons, make sure you satisfy their usage requirements.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search