Загрузка...
Стилизованная SVG-иллюстрация вертикальной карточки с эффектом стекломорфизма. Идеально для UI, плейсхолдеров, графики.
<svg width="61" height="106" viewBox="0 0 61 106" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M7 6.2066H54C57.5899 6.2066 60.5 9.11675 60.5 12.7066V98.7066C60.5 102.296 57.5899 105.207 54 105.207H7C3.41015 105.207 0.5 102.296 0.5 98.7066V12.7066C0.5 9.11675 3.41015 6.2066 7 6.2066Z"
fill="url(#paint0_radial_75014_27859)" fill-opacity="0.5" />
<path
d="M7 6.2066H54C57.5899 6.2066 60.5 9.11675 60.5 12.7066V98.7066C60.5 102.296 57.5899 105.207 54 105.207H7C3.41015 105.207 0.5 102.296 0.5 98.7066V12.7066C0.5 9.11675 3.41015 6.2066 7 6.2066Z"
stroke="currentColor" stroke-opacity="0.2" />
<path
d="M7 6.2066H54C57.5899 6.2066 60.5 9.11675 60.5 12.7066V98.7066C60.5 102.296 57.5899 105.207 54 105.207H7C3.41015 105.207 0.5 102.296 0.5 98.7066V12.7066C0.5 9.11675 3.41015 6.2066 7 6.2066Z"
stroke="url(#paint1_linear_75014_27859)" style="mix-blend-mode:overlay" />
<path
d="M20.4999 1.2066H38.4999C39.8807 1.2066 40.9999 2.32589 40.9999 3.7066V5.2066H17.9999V3.7066C17.9999 2.32589 19.1192 1.2066 20.4999 1.2066Z"
fill="url(#paint2_linear_75014_27859)" />
<path
d="M20.4999 1.2066H38.4999C39.8807 1.2066 40.9999 2.32589 40.9999 3.7066V5.2066H17.9999V3.7066C17.9999 2.32589 19.1192 1.2066 20.4999 1.2066Z"
stroke="url(#paint3_linear_75014_27859)" stroke-opacity="0.2" />
<path
d="M20.4999 1.2066H38.4999C39.8807 1.2066 40.9999 2.32589 40.9999 3.7066V5.2066H17.9999V3.7066C17.9999 2.32589 19.1192 1.2066 20.4999 1.2066Z"
stroke="url(#paint4_linear_75014_27859)" style="mix-blend-mode:overlay" />
<path d="M2 46.7066H59V60.6597H2V46.7066Z" fill="url(#paint5_linear_75014_27859)" />
<path d="M2 61.2535H59V75.2066H2V61.2535Z" fill="url(#paint6_linear_75014_27859)" />
<path d="M2 75.8004H59V89.4566H2V75.8004Z" fill="url(#paint7_linear_75014_27859)" />
<path d="M2 90.0504H59V97.7691C59 101.707 56.5 103.707 52.871 103.707H8.12903C4 103.707 2 101.207 2 97.7691V90.0504Z"
fill="url(#paint8_linear_75014_27859)" />
<foreignObject x="1.93604" y="17.8373" width="56.0395" height="59.9224">
<div xmlns="http://www.w3.org/1999/xhtml"
style="backdrop-filter:blur(10px);clip-path:url(#bgblur_0_75014_27859_clip_path);height:100%;width:100%"></div>
</foreignObject>
<g filter="url(#filter0_ddd_75014_27859)" data-figma-bg-blur-radius="20">
<path
d="M31.8837 45.0514V38.8393C31.8837 37.8653 30.633 37.466 30.0687 38.2599L22.1228 49.4376C21.6521 50.0996 22.1255 51.0169 22.9378 51.0169H27.5349C28.0872 51.0169 28.5349 51.4647 28.5349 52.0169V56.7578C28.5349 57.7136 29.7472 58.1247 30.3286 57.3661L37.7674 47.6597C38.2716 47.0019 37.8026 46.0514 36.9737 46.0514H32.8837C32.3314 46.0514 31.8837 45.6037 31.8837 45.0514Z"
fill="currentColor" style="mix-blend-mode:overlay" shape-rendering="crispEdges" />
<path
d="M30.4766 38.5494C30.7588 38.1528 31.3838 38.3525 31.3838 38.8394V45.0513C31.3838 45.8798 32.0554 46.5513 32.8838 46.5513H36.9736C37.3881 46.5513 37.6222 47.0271 37.3701 47.356L29.9316 57.0621C29.6409 57.4412 29.0352 57.2352 29.0352 56.7574V52.0172C29.0352 51.1888 28.3635 50.5173 27.5352 50.5172H22.9375C22.5315 50.5169 22.295 50.0581 22.5303 49.7271L30.4766 38.5494Z"
stroke="currentColor" stroke-opacity="0.2" style="mix-blend-mode:overlay" shape-rendering="crispEdges" />
<path
d="M30.4766 38.5494C30.7588 38.1528 31.3838 38.3525 31.3838 38.8394V45.0513C31.3838 45.8798 32.0554 46.5513 32.8838 46.5513H36.9736C37.3881 46.5513 37.6222 47.0271 37.3701 47.356L29.9316 57.0621C29.6409 57.4412 29.0352 57.2352 29.0352 56.7574V52.0172C29.0352 51.1888 28.3635 50.5173 27.5352 50.5172H22.9375C22.5315 50.5169 22.295 50.0581 22.5303 49.7271L30.4766 38.5494Z"
stroke="currentColor" stroke-opacity="0.2" shape-rendering="crispEdges" />
</g>
<defs>
<filter id="filter0_ddd_75014_27859" x="1.93604" y="17.8373" width="56.0395" height="59.9224"
filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix" />
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
result="hardAlpha" />
<feOffset dy="10" />
<feGaussianBlur stdDeviation="5" />
<feComposite in2="hardAlpha" operator="out" />
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0" />
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_75014_27859" />
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
result="hardAlpha" />
<feOffset dy="4" />
<feGaussianBlur stdDeviation="2" />
<feComposite in2="hardAlpha" operator="out" />
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.05 0" />
<feBlend mode="normal" in2="effect1_dropShadow_75014_27859" result="effect2_dropShadow_75014_27859" />
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
result="hardAlpha" />
<feOffset dy="1" />
<feComposite in2="hardAlpha" operator="out" />
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.05 0" />
<feBlend mode="normal" in2="effect2_dropShadow_75014_27859" result="effect3_dropShadow_75014_27859" />
<feBlend mode="normal" in="SourceGraphic" in2="effect3_dropShadow_75014_27859" result="shape" />
</filter>
<clipPath id="bgblur_0_75014_27859_clip_path" transform="translate(-1.93604 -17.8373)">
<path
d="M31.8837 45.0514V38.8393C31.8837 37.8653 30.633 37.466 30.0687 38.2599L22.1228 49.4376C21.6521 50.0996 22.1255 51.0169 22.9378 51.0169H27.5349C28.0872 51.0169 28.5349 51.4647 28.5349 52.0169V56.7578C28.5349 57.7136 29.7472 58.1247 30.3286 57.3661L37.7674 47.6597C38.2716 47.0019 37.8026 46.0514 36.9737 46.0514H32.8837C32.3314 46.0514 31.8837 45.6037 31.8837 45.0514Z" />
</clipPath>
<radialGradient id="paint0_radial_75014_27859" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse"
gradientTransform="translate(10.7227 10.0035) rotate(79.8216) scale(111.918 45.6045)">
<stop stop-color="currentColor" stop-opacity="0.5" />
<stop offset="0.780575" stop-color="#1C1B33" stop-opacity="0.2" />
</radialGradient>
<linearGradient id="paint1_linear_75014_27859" x1="3.355" y1="7.49232" x2="27.0527" y2="36.6348"
gradientUnits="userSpaceOnUse">
<stop stop-color="currentColor" />
<stop offset="1" stop-color="currentColor" stop-opacity="0" />
</linearGradient>
<linearGradient id="paint2_linear_75014_27859" x1="29.4999" y1="-1.01215" x2="29.4999" y2="6.80035"
gradientUnits="userSpaceOnUse">
<stop stop-color="currentColor" stop-opacity="0" />
<stop offset="1" stop-color="currentColor" />
</linearGradient>
<linearGradient id="paint3_linear_75014_27859" x1="29.4999" y1="0.706604" x2="29.4999" y2="5.7066"
gradientUnits="userSpaceOnUse">
<stop stop-color="currentColor" />
<stop offset="1" stop-color="currentColor" stop-opacity="0" />
</linearGradient>
<linearGradient id="paint4_linear_75014_27859" x1="21.3999" y1="-0.855896" x2="23.0153" y2="4.10655"
gradientUnits="userSpaceOnUse">
<stop stop-color="currentColor" />
<stop offset="1" stop-color="currentColor" stop-opacity="0" />
</linearGradient>
<linearGradient id="paint5_linear_75014_27859" x1="30.5" y1="35.8223" x2="30.5" y2="103.707"
gradientUnits="userSpaceOnUse">
<stop stop-color="currentColor" stop-opacity="0" />
<stop offset="1" stop-color="currentColor" />
</linearGradient>
<linearGradient id="paint6_linear_75014_27859" x1="30.5" y1="35.8223" x2="30.5" y2="103.707"
gradientUnits="userSpaceOnUse">
<stop stop-color="currentColor" stop-opacity="0" />
<stop offset="1" stop-color="currentColor" />
</linearGradient>
<linearGradient id="paint7_linear_75014_27859" x1="30.5" y1="35.8223" x2="30.5" y2="103.707"
gradientUnits="userSpaceOnUse">
<stop stop-color="currentColor" stop-opacity="0" />
<stop offset="1" stop-color="currentColor" />
</linearGradient>
<linearGradient id="paint8_linear_75014_27859" x1="30.5" y1="35.8223" x2="30.5" y2="103.707"
gradientUnits="userSpaceOnUse">
<stop stop-color="currentColor" stop-opacity="0" />
<stop offset="1" stop-color="currentColor" />
</linearGradient>
</defs>
</svg>