Home > Net >  SVG in-line to CSS
SVG in-line to CSS

Time:08-30

I have a svg image that I use in-line on my html file and it works perfectly. How can I have less HTML in-line code and convert it to CSS?

I have tried to create a css class and use it like an image with a class but that doesn't seem to work.

I wanted to have less HTML code and have more CSS so I can I use my styles.css file.

    <div >
        <CultureSelector />
        <div >
            <svg xmlns="http://www.w3.org/2000/svg" width="832.304" height="407.825" viewBox="0 0 832.304 407.825">
                <g id="Group_531" data-name="Group 531" transform="translate(-897.84 -269.303)">
                    <g id="Ilustração" transform="translate(1858.333 -34.063)">
                        <g id="Detalhes" transform="translate(-920 310.063)">
                            <path id="Fundo" d="M96.416,393.891S-77.153,293.156,41.471,185.157,318.842-33.245,425.246,9.478s96.833,96.711,213.715,174.869S728.8,324.567,707.869,356s-24.417,39.484-24.417,39.484l-266.574-.736Z" transform="translate(0 -0.063)" fill="#464646" opacity="0.12" />
                            <path id="Base" d="M657.445,169.633H40.25a5.182,5.182,0,0,1-1.08-10.307,7.568,7.568,0,0,1,1.055,0h617.2a5.182,5.182,0,0,1,1.08,10.307A3.8,3.8,0,0,1,657.445,169.633Z" transform="translate(50.202 231.458)" fill="#2d2d2d" />
                            <g id="Planta" transform="translate(542.739 54.191)">
                                <path id="Caminho_176" d="M68.669,275.41c10.724-58.87,8.393-79.925-20.368-127.974S16.842,9.966,6,36.2s-9.374,92.1,24.564,124.048S69.086,206.528,71.1,219.534s-4.834,52.981-4.834,52.981Z" transform="translate(0.005 45.598)" fill="#7d7d7d" />
                                <path id="Caminho_177" d="M74.037,237.451c.025-.221.025-.442.049-.687-.638-4.834-4.049-29.668-8.761-39.46-5.227-10.871-28.2-29.816-34.65-53.594S14.013,101.5,7.289,86.483C-1.57,66.655,3.265,40.3,10.6,31.735a1.533,1.533,0,0,0-.54-.245L7.633,32.962a17.049,17.049,0,0,0-1.644,3.19C-4.833,62.385-3.386,128.25,30.553,160.2s38.527,46.282,40.539,59.288a77.53,77.53,0,0,1,0,15.092Z" transform="translate(0.012 45.619)" fill="#2d2d2d" />
                                <path id="Caminho_178" d="M28.945,310.671c7.975-69.177,5.325-93.128-10.11-148.465S103.988-19.239,100.8,2.576s-13.84,76.1-41.5,110.158S29.51,174.476,34.81,203.728,33.755,301.1,33.755,301.1l-3.19,12.245Z" transform="translate(25.054 -0.068)" fill="#7d7d7d" />
                                <g id="Grupo_55" transform="translate(47.196 7.777)">
                                    <path id="Caminho_179" d="M10.5,274.164h-.025a.66.66,0,0,1-.638-.687h0c0-.221.81-21.546.393-39.042A326.478,326.478,0,0,0,2.2,176.57c-2.626-9.4-5.939-40.883,10.11-73.4A417.838,417.838,0,0,1,35.527,62.559C44.263,48.547,55.134,31.124,72.361.4A.654.654,0,0,1,73.269.18a.665.665,0,0,1,.245.883C56.263,31.787,45.392,49.234,36.656,63.247a415.29,415.29,0,0,0-23.141,40.49C-2.362,135.884.9,166.951,3.478,176.2a327.816,327.816,0,0,1,8.074,58.183c.393,17.546-.393,38.92-.417,39.116A.625.625,0,0,1,10.5,274.164Z" transform="translate(-0.004 -0.079)" fill="#2d2d2d" />
                                </g>
                                <path id="Caminho_180" d="M33.924,256.538c4.785-46.306,5.6-23.46-14.307-86.379C-3.131,98.184,78.1,34.258,91.4,60.344s28.736,108.023,22.871,105.373S69.58,86.945,68.525,90.135s-52.687,29.791-50.552,56.932,21.816,70.257,21.816,70.257l-.54,39.754Z" transform="translate(22.726 78.924)" fill="#7d7d7d" />
                                <g id="Grupo_56" transform="translate(37.694 132.662)">
                                    <path id="Caminho_181" d="M24.3,202.868h-.074l-5.325-.54a.663.663,0,0,1-.589-.736h0c.564-5.35,1.055-9.865,1.472-13.472,2.233-19.656,2.233-19.656-3.877-36.49-2.748-7.607-6.528-18.037-11.877-34.92A86.062,86.062,0,0,1,.963,77.79,99.521,99.521,0,0,1,12.815,43.729C23.367,24.883,39.956,8.711,55.072,2.527,65.575-1.792,73.6-.369,77.035,6.38,82.679,17.447,89.428,40.122,95.1,66.992c3.264,15.509,8.074,42.552,5.35,45.4a1.2,1.2,0,0,1-1.4.245C95.857,111.188,85.281,92.514,70.7,66.33,63.391,53.2,55.833,39.631,53.8,37.3a55.571,55.571,0,0,1-7.19,5.251c-14.454,9.816-44.539,30.208-42.92,50.8,2.086,26.7,21.57,69.594,21.767,70.011a.422.422,0,0,1,.049.294l-.54,38.552a.618.618,0,0,1-.221.491A.706.706,0,0,1,24.3,202.868Zm-4.589-1.791,3.926.393.515-37.668C22.926,161.077,4.4,119.654,2.337,93.471c-1.669-21.349,28.834-42.061,43.509-52a50.6,50.6,0,0,0,7.092-5.2.834.834,0,0,1,.663-.54c1.3-.123,3.853,4.074,18.257,29.963,10.356,18.576,24.491,43.975,27.681,45.717.245-.393.982-2.577-.442-13.816-1.031-8.123-2.9-18.822-5.251-30.11C88.2,40.612,81.477,17.987,75.857,6.969,72.765.907,65.379-.271,55.588,3.754,29.06,14.625-11.6,62.87,5.306,116.293c5.325,16.859,9.1,27.263,11.853,34.871,6.209,17.129,6.209,17.129,3.951,37.1-.417,3.656-.883,7.755-1.4,12.81Z" transform="translate(0.004 -0.068)" fill="#2d2d2d" />
                                </g>
                                <path id="Caminho_182" d="M51.018,178.014H26.871c-1.669,0-3.141-.957-3.288-2.11L15.46,114.9a4.338,4.338,0,0,1,3.386-5.1,3.811,3.811,0,0,1,.761-.074H58.281a4.311,4.311,0,0,1,4.221,4.417,4,4,0,0,1-.074.761L54.306,175.9C54.159,177.081,52.686,178.014,51.018,178.014Z" transform="translate(22.368 159.362)" fill="#057085" />
                                <path id="Caminho_183" d="M32.579,172.089h-3.46c-1.693,0-3.043-.982-3.018-2.209l1.227-52.687a4.933,4.933,0,0,1,4.785-4.834h5.251a4.236,4.236,0,0,1,4.2,4.245,4.765,4.765,0,0,1-.049.589l-5.6,52.687C35.744,171.108,34.272,172.089,32.579,172.089Z" transform="translate(37.961 163.201)" fill="#0aa7c4" opacity="0.45" />
                                <g id="Grupo_57" transform="translate(41.507 167.842)">
                                    <path id="Caminho_184" d="M3.288,43.746l.417-.736A153.224,153.224,0,0,1,0,26.47,84.554,84.554,0,0,0,3.288,43.746Z" transform="translate(0 38.329)" fill="#464646" />
                                    <path id="Caminho_185" d="M3.143,37.526A48.792,48.792,0,0,0,.1,49.575C7.216,26.189,46.9,5.06,49.474,1.477L49.94.594C35.02-3.553,11.192,17.379,3.143,37.526Z" transform="translate(0.145 -0.064)" fill="#2d2d2d" />
                                </g>
                                <g id="Grupo_58" transform="translate(42.5 143.186)">
                                    <path id="Caminho_186" d="M94.556,100.061a.657.657,0,0,1-.638-.515L86.7,70.2C81.059,47.2,74.065,18.59,66.188,5.854c-1.3-2.11-6.969-4.932-14.994-4.368C40.348,2.246,19.44,9.755,1.281,51.3a.666.666,0,0,1-.883.344.666.666,0,0,1-.344-.883h0C18.507,8.553,39.955.946,51.1.136c8.662-.613,14.7,2.552,16.221,5.006C75.292,18.05,82.04,45.583,87.979,69.877l7.215,29.349a.656.656,0,0,1-.491.81h0A.311.311,0,0,1,94.556,100.061Z" transform="translate(0.003 -0.059)" fill="#2d2d2d" />
                                </g>
                                <g id="Grupo_59" transform="translate(111.612 153.62)">
                                    <path id="Caminho_187" d="M4.294,51.357H4.22a.663.663,0,0,1-.589-.736A156.831,156.831,0,0,0,.024.9.656.656,0,0,1,.515.094a.656.656,0,0,1,.81.491h0A158.477,158.477,0,0,1,4.956,50.793.663.663,0,0,1,4.294,51.357Z" transform="translate(0 -0.07)" fill="#2d2d2d" />
                                </g>
                                <g id="Grupo_60" transform="translate(107.777 147.975)">
                                    <path id="Caminho_188" d="M.666,42.083H.592A.663.663,0,0,1,0,41.347,223.7,223.7,0,0,0,.813.807.681.681,0,0,1,1.4.071.681.681,0,0,1,2.138.66h0a226.951,226.951,0,0,1-.81,40.834A.645.645,0,0,1,.666,42.083Z" transform="translate(0.002 -0.069)" fill="#2d2d2d" />
                                </g>
                                <g id="Grupo_61" transform="translate(82.399 39.986)">
                                    <path id="Caminho_189" d="M.663,31.606a.66.66,0,0,1-.294-1.252A76.23,76.23,0,0,0,30.7.416a.68.68,0,0,1,.908-.27.68.68,0,0,1,.27.908,77.523,77.523,0,0,1-30.92,30.5A.622.622,0,0,1,.663,31.606Z" transform="translate(0 -0.068)" fill="#2d2d2d" />
                                </g>
                                <g id="Grupo_62" transform="translate(68.296 75.829)">
                                    <path id="Caminho_190" d="M.663,19.937A.66.66,0,0,1,0,19.274a.681.681,0,0,1,.54-.663c.147-.025,15.8-3.386,34.355-18.4a.663.663,0,0,1,.834,1.031C16.883,16.5.957,19.888.81,19.937Z" transform="translate(0 -0.06)" fill="#2d2d2d" />
                                </g>
                                <g id="Grupo_63" transform="translate(56.207 105.251)">
                                    <path id="Caminho_191" d="M1.105,13.919a2.019,2.019,0,0,1-.491-.025.664.664,0,0,1,.1-1.325c.1,0,10.9.589,28.171-12.368a.665.665,0,1,1,.81,1.055C13.817,13.158,3.436,13.919,1.105,13.919Z" transform="translate(0.001 -0.064)" fill="#2d2d2d" />
                                </g>
                            </g>
                            <g id="Senhora" transform="translate(214.064 80.489)">
                                <g id="Grupo_15905" transform="translate(0 0)">
                                    <g id="Grupo_15901" transform="translate(0 15.686)">
                                        <g id="Grupo_15898" transform="translate(22.882 169.601)">
                                            <path id="Caminho_10424" d="M33.766.07l-28.1,125H0L22.454.07Z" transform="translate(0 -0.07)" fill="#2d2d2d" />
                                            <path id="Caminho_10425" d="M69.8.07l-28.1,125H36.03L58.484.07H69.8Z" transform="translate(52.386 -0.07)" fill="#2d2d2d" />
                                        </g>
                                        <g id="Grupo_15899" transform="translate(99.409 169.601)">
                                            <path id="Caminho_10426" d="M60.668,125.075H55L36.03.07H47.367Z" transform="translate(52.386 -0.07)" fill="#2d2d2d" />
                                            <path id="Caminho_10427" d="M24.638,125.075H18.969L0,.07H11.337Z" transform="translate(0 -0.07)" fill="#2d2d2d" />
                                        </g>
                                        <g id="Grupo_15900" transform="translate(0 0)">
                                            <path id="Caminho_10428" d="M20.018.07h114.5a16.469,16.469,0,0,1,16.466,16.466v.147c-.2,19.951-1.6,54.7-1.6,86.993,0,28.049,35.043,24.417,57.643,23.533s22.6,21.718,22.6,21.718l-18.061,66.919s-158.182,1.816-161.79,0S15.429,145.271,5.49,81.934A313.448,313.448,0,0,1,1.073,18.008,18.926,18.926,0,0,1,20.018.07Z" transform="translate(1.311 -0.07)" fill="#23bcd9" />
                                            <path id="Caminho_10429" d="M88.49,52.19a7.675,7.675,0,0,1,2.847,1.2A19.408,19.408,0,0,0,88.49,52.19Z" transform="translate(128.664 75.71)" fill="#b13f02" />
                                            <path id="Caminho_10430" d="M2.358,10.165c3.485-7.779,6.184-8.1,8.221-8.785-6.6,18.5-8.662,84.367,14.282,105.545,32.539,30.012,33.251,22.282,46.8,35.828s5.423,17.423,14.454,42.6,12.662,24.2,12.662,24.2H208.343s15.534-46.036,18.086-61.962c.834-5.251.54-15.607-6.429-20.319a20.043,20.043,0,0,1,10.945,12.564c2.822,11.337-13.57,77.717-13.57,77.717a13.508,13.508,0,0,1-11.754,10.65c-8.147.785-116.735-.2-162.059-.564a20.932,20.932,0,0,1-20.147-15.828C14.088,174.9-6.893,80.4,2.26,10.337A.4.4,0,0,0,2.358,10.165Z" transform="translate(0.001 1.835)" fill="#11a2bd" />
                                        </g>
                                        <rect id="Retângulo_6227" width="139.238" height="31.19" transform="translate(71.267 181.691)" fill="#23bcd9" />
                                        <path id="Caminho_10431" d="M149.783,93.879a9.292,9.292,0,0,0-5.2-1.472H73.2C62.57,83.916,51.183,76.7,41.76,74.1H149.783Z" transform="translate(60.721 107.567)" fill="#23bcd9" />
                                    </g>
                                    <path id="Caminho_10432" d="M43.742,25.2s15.509.613,21.276,24.392c7.877,32.417,24.368,70.7,24.368,70.7l-17.03,3.656L42.712,61.393S29.779,15.43,43.742,25.2Z" transform="translate(54.174 34.506)" fill="#fff" />
                                    <g id="Grupo_15902" transform="translate(47.846 19.122)">
                                        <path id="Caminho_10433" d="M53.451,3.923s-.54,8.638-1.546,26.233c-.613,10.8-1.546,12.957-1.546,12.957s-24.122-22.7-42.944-9.276C.519,38.793,11.194.07,11.194.07Z" transform="translate(7.43 -0.07)" />
                                        <path id="Caminho_10434" d="M33.241,51.57S96.43,70.392,121.681,76.576,143.374,107,143.374,107s-31.386-1.3-36.589-3.779-84.244,1.3-84.244,1.3c-21.3-3.043-14.748-42.65-14.748-42.65Z" transform="translate(9.971 74.809)" fill="#bebebe" />
                                        <path id="Caminho_10435" d="M31.072,55.768s8.54,1.963,44.1-.982c26.7-2.233,42.208,1.963,48.294,4.2a9.944,9.944,0,0,1,5.006,4l.025.025a74.153,74.153,0,0,1,11.19,19.018c5.276,13.055,37.177,67.778,37.177,67.778l-14.626,6.037s-27.705-30.724-37.1-43.852c-4.245-5.914-10.65-17.325-11.411-28.392-13.3,3.067-52.882,13.129-78.354,14.9-19.021-.4-25.94-13.227-25.94-13.227Z" transform="translate(13.71 78.562)" fill="#7d7d7d" />
                                        <path id="Caminho_10436" d="M11.768,33.328c.908,10.945,9.08,21.693,15.386,29.742C37.387,76.149,48.43,86.162,64.479,91.462c.294.1.564.147.834.221a11.555,11.555,0,0,0,5.1,7.215c-.932.736-11.485,4.736-13.006,5.669-.663.417-1.129.712-1.472.933a11.54,11.54,0,0,0-1.252.294c-2.478.712-4.883,1.571-7.386,2.184-1.89.466-3.8.859-5.742,1.2.172-.123-4.736.466-5.62.54a151.864,151.864,0,0,1-16.711.1c-.933-.049-1.865-.147-2.773-.2C12.921,99.364,3.571,56.69.725,38.653a49.531,49.531,0,0,1-.368-14.5C4.087,27.316,7.89,30.359,11.768,33.328Z" transform="translate(0.009 34.941)" opacity="0.06" />
                                        <path id="Caminho_10437" d="M92.341,64.846a17.355,17.355,0,0,1,8,8.638c2.675,8.147,10.208,112,10.208,112l-13.816.466s-11.975-41.349-17.3-57.766c-6.258-19.264-6.086-33.57-4.319-36.589S21.25,86.76,21.25,86.76L78.943,63.791A15.182,15.182,0,0,1,92.341,64.846Z" transform="translate(30.919 91.005)" fill="#7d7d7d" />
                                        <path id="Caminho_10438" d="M37.734,72.185c10.177-.441,20.4-1.766,30.606-1.177,11.232.638,17.167,3.188,20.11,14.42,3.752,14.224,4.341,29.036,6.793,43.506,2.526,14.911,8.142,29.184,13.317,43.334a8.922,8.922,0,0,0,.736,1.545l-6.548.2s-11.968-41.323-17.289-57.73C79.2,97.028,79.376,82.73,81.141,79.714S20.224,75.3,20.224,75.3L17.06,71.474C17.943,71.694,36.679,72.234,37.734,72.185Z" transform="translate(24.885 102.921)" fill="#2d2d2d" opacity="0.36" />
                                        <path id="Caminho_10439" d="M12.064,49.778c11.509,3.043,48.809,8.074,48.809,8.074l-2.11,10.5S21.758,75.4,1.022,62.711C1.022,62.711.555,46.735,12.064,49.778Z" transform="translate(1.503 71.644)" fill="#fff" />
                                        <path id="Caminho_10440" d="M42.763,52.09l14.184,9.889L36.6,64.752H22.42L29.782,53.93Z" transform="translate(32.62 75.565)" fill="#fff" />
                                        <path id="Caminho_10441" d="M103.732,108.007s5.423,3.19,12.491,7.705c5.3,3.362.27,8.883-8.662,7.705-14.429-1.939-14.92-5.3-20.687-4.81a22.583,22.583,0,0,1-11.534-2.9s-3.534-.81-4-15.73L84.959,92.13Z" transform="translate(103.747 133.782)" fill="#fff" />
                                        <path id="Caminho_10442" d="M108.846,101.8a10.377,10.377,0,0,0,1.521-.27c1.546.957,3.288,2.037,5.129,3.215,5.3,3.362.27,8.883-8.662,7.705-14.429-1.939-14.92-5.3-20.687-4.81a22.583,22.583,0,0,1-11.534-2.9s-1.571-.393-2.773-5.08a47.5,47.5,0,0,0,15.583,4.564C93.975,105.167,103.005,105.584,108.846,101.8Z" transform="translate(104.474 144.744)" fill="#057085" />
                                        <path id="Caminho_10443" d="M65.581,111.75s5.759,7.2,21.123,11.542c1.495.417,4.7,4.386,2.843,5.562H52.618a46.06,46.06,0,0,1-.637-15.658Z" transform="translate(75.088 162.308)" fill="#fff" />
                                        <path id="Caminho_10444" d="M76.572,117.307a9.539,9.539,0,0,0,4.834-1.252c1.62.614,3.362,1.178,5.276,1.718,1.5.417,4.712,4.393,2.847,5.57H52.548a34.775,34.775,0,0,1-.908-7.8A107.476,107.476,0,0,0,76.572,117.307Z" transform="translate(75.104 167.819)" fill="#057085" stroke="#057085" stroke-width="1" />
                                    </g>
                                    <path id="Caminho_10445" d="M37.168,33.739c3.386,5.055,5.227,29.055,2.4,49.447s4.123,37.963-6.724,39.46-15.067-28.122-16-56.441c-.54-16.1-1.62-30.282,5.325-36.245C30,23.261,33.855,28.831,37.168,33.739Z" transform="translate(23.915 38.921)" fill="#fff" />
                                    <path id="Caminho_10446" d="M2.529,17.476A13.4,13.4,0,0,1,13.915,7.12c-7.092,18.5-11.828,85.938,12.81,107.091,34.944,30.036,46.674,24.736,61.251,38.306s5.816,17.423,15.534,42.6c2.552,6.65,6.626,15.411,6.7,15.632,3.853,10.208-2.159,17.325,5.914,24.736-26.4-.172-52.1-.393-69.3-.515a22.257,22.257,0,0,1-21.644-15.828C15.142,182.21-7.41,87.733,2.431,17.672A.493.493,0,0,0,2.529,17.476Z" transform="translate(0.002 10.203)" fill="#11a2bd" />
                                    <path id="Caminho_10447" d="M19.527,110.905c17.84,40.981,50.4,72.318,94.208,82.478a14.954,14.954,0,0,0,2.11,2.38c-26.4-.172-52.1-.393-69.3-.515A22.257,22.257,0,0,1,24.9,179.42C17.392,151.837,2.914,92.108.19,34.44c.393,3.411.834,6.8,1.3,10.184A252.3,252.3,0,0,0,19.527,110.905Z" transform="translate(0.28 49.925)" fill="#057085" />
                                    <g id="Grupo_15903" transform="translate(53.383)">
                                        <path id="Caminho_10448" d="M28.313,22.917,27.086,34.353s.834,9.2-4.712,9.62c-2.92.221-11.337-3.411-14.945-8.834L12.78,19.31Z" transform="translate(10.802 27.927)" fill="#866f5d" />
                                        <path id="Caminho_10449" d="M28.873,20.7,27.646,32.113s.834,9.178-4.712,9.62C20.014,41.953,11.6,38.321,7.99,32.9L13.34,17.07Z" transform="translate(11.616 24.67)" fill="#dedede" />
                                        <path id="Caminho_10450" d="M34.147,3.676c12.221,3.853,9.988,23.877,7.779,31.877S38,48.387,32.4,51.013s-19.337-7.607-19.337-7.607c-4.319-9.742-7.485-21.84-6.209-28.171S21.927-.177,34.147,3.676Z" transform="translate(9.557 3.856)" fill="#fff" />
                                        <path id="Caminho_10451" d="M17.938,4.108A28.781,28.781,0,0,1,49.4,5.433c9.055,6.8,7.853,21.3,7.853,21.3S31.9,23.347,29.275,24.868c-1.4.81-3.239,5.325-3.926,9.718-3.558,22.626-.294,25.84-.294,25.84S6.306,61.015,1.2,50.242,8.318,9.776,17.938,4.108Z" transform="translate(0 -0.061)" />
                                    </g>
                                    <g id="Grupo_15904" transform="translate(85.328 100.606)">
                                        <path id="Caminho_10452" d="M76.378,7.179,63.1,58.172,15.52,60.062,29.655,5.731a5.68,5.68,0,0,1,5.276-4.245L70.636.063A5.7,5.7,0,0,1,76.55,5.51,6.324,6.324,0,0,1,76.378,7.179Z" transform="translate(22.565 -0.058)" fill="#2d2d2d" />
                                        <path id="Caminho_10453" d="M85.913,22.52l.025.785a3.847,3.847,0,0,1-3.705,4h0L7.705,30.25C5.57,30.324.1,28.827,0,26.692l3.656-.933Z" transform="translate(0 32.6)" fill="#2d2d2d" />
                                    </g>
                                    <path id="Caminho_10454" d="M42.852,26.081l2.307,1.742a5.332,5.332,0,0,0,2.871,1.055c2.748.147,6.4-3.73,9.153-3.73a5.3,5.3,0,0,0,2.65-.712h0a5.251,5.251,0,0,1,7.141,1.939,4.809,4.809,0,0,1,.466,1.1l21.57,80.244a5.209,5.209,0,0,1-3.534,6.478,6.915,6.915,0,0,1-.761.172l-6.209.883a4.821,4.821,0,0,1-1.571-.025l-43.509-7.19a5.2,5.2,0,0,1-4.368-5.276C29.428,89.442,29.846,50.6,23,37.516a5.208,5.208,0,0,1,2.037-7.092,5.9,5.9,0,0,1,.564-.27l12.2-4.761A5.325,5.325,0,0,1,42.852,26.081Z" transform="translate(32.489 34.382)" fill="#bdbdbd" />
                                </g>
                            </g>
                        </g>
                    </g>
                    <path id="Path_423" data-name="Path 423" d="M-806.868,2457.019c-24.645.017-55.72,15.018-42.862,27.877s40.484,16.483,56.792,5.358S-782.222,2457-806.868,2457.019Z" transform="translate(110.964 2513.176) rotate(-161)" fill="#e8e8e8" />
                    <path id="Path_424" data-name="Path 424" d="M-826.152,2457.019c-14.283.01-1.378,25.708,8.073,19.261S-811.869,2457.009-826.152,2457.019Z" transform="translate(-927.286 136.717) rotate(-103)" fill="#e8e8e8" />
                    <path id="Path_425" data-name="Path 425" d="M-1267.953,2622.091c-17.5-28.652-223.159,1.791-153.148,42.978S-1250.45,2650.743-1267.953,2622.091Z" transform="matrix(-0.788, 0.616, -0.616, -0.788, 1550.089, 3264.817)" fill="#e8e8e8" />
                </g>
            </svg>
    </div>
</div>
<BlazoredToasts />

CodePudding user response:

  1. create a svg file
  2. import that file into you html like
<object data="./svg/svgImage.svg" type="image/svg xml"> </object>

CodePudding user response:

With URL-encoder for SVG you paste in the SVG code into "Insert SVG:" and take out the code at the "Ready for CSS:".

  • Related