[SVG]修改固定顏色為填充顏色

夕苜19發表於2024-04-09
SVG

主要思路是把 fill 和 stroke 改成 currentColor，具體以後補充。

修改之前：

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36">
  <g transform="translate(1 1)" fill="none" fill-rule="evenodd">
    <rect fill="#C8C8C8" transform="rotate(-90 17 23)" x="12" y="22" width="10" height="2" rx="1"/>
    <rect fill="#C8C8C8" transform="rotate(-90 12 21)" x="5" y="20" width="14" height="2" rx="1"/>
    <rect fill="#C8C8C8" transform="rotate(-90 22 21)" x="15" y="20" width="14" height="2" rx="1"/>
    <rect fill="#C8C8C8" transform="rotate(-90 27 19)" x="18" y="18" width="18" height="2" rx="1"/>
    <rect fill="#C8C8C8" transform="rotate(-90 7 19)" x="-2" y="18" width="18" height="2" rx="1"/>
    <rect stroke="#757575" stroke-width="2" x="1" y="1" width="32" height="26" rx="4"/>
    <rect stroke="#757575" stroke-width="2" x="1" y="33" width="32" height="1" rx=".5"/>
  </g>
</svg>

修改之後

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36">
  <g transform="translate(1 1)" fill="none" fill-rule="evenodd">
    <rect fill="currentColor" fill-opacity="0.5" transform="rotate(-90 17 23)" x="12" y="22" width="10" height="2" rx="1"/>
    <rect fill="currentColor" fill-opacity="0.5" transform="rotate(-90 12 21)" x="5" y="20" width="14" height="2" rx="1"/>
    <rect fill="currentColor" fill-opacity="0.5" transform="rotate(-90 22 21)" x="15" y="20" width="14" height="2" rx="1"/>
    <rect fill="currentColor" fill-opacity="0.5" transform="rotate(-90 27 19)" x="18" y="18" width="18" height="2" rx="1"/>
    <rect fill="currentColor" fill-opacity="0.5" transform="rotate(-90 7 19)" x="-2" y="18" width="18" height="2" rx="1"/>
    <rect stroke="currentColor" stroke-width="2" x="1" y="1" width="32" height="26" rx="4"/>
    <rect stroke="currentColor" stroke-width="2" x="1" y="33" width="32" height="1" rx=".5"/>
  </g>
</svg>

相關文章