简体   繁体   中英

how to darken an svg that is being used for a cursor

This is the code of the svg I am using in scss as a cursor. It is a crosshair of vertical and horizontal lines, and they are currently opaque and barely visible. I need to get them to black with no opacity, but nothing I have changed in the code works. I am working in ReactJS using SASS css: cursor: url(crosshairs.svg), auto; .

 <?xml version="1.0" encoding="UTF-8" standalone="no"?> <!-- Created with Inkscape (http://www.inkscape.org/) EDIT: was height: 3301, width:2161 reduced to x128 else it wont show up--> <svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" width="128" height="128" viewBox="0 0 873.389 571.765" version="1.1" id="svg8" inkscape:version="0.92.3 (unknown)" sodipodi:docname="fullscreen-crosshair-1650x1080.svg"> <defs id="defs2" /> <sodipodi:namedview id="base" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0" inkscape:pageopacity="0.0" inkscape:pageshadow="2" inkscape:zoom="0.25" inkscape:cx="1437.71" inkscape:cy="1122.57" inkscape:document-units="mm" inkscape:current-layer="layer1" showgrid="false" units="px" inkscape:window-width="1680" inkscape:window-height="1016" inkscape:window-x="0" inkscape:window-y="0" inkscape:window-maximized="1" /> <metadata id="metadata5"> <rdf:RDF> <cc:Work rdf:about=""> <dc:format>image/svg+xml</dc:format> <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> <dc:title></dc:title> </cc:Work> </rdf:RDF> </metadata> <g inkscape:label="Layer 1" inkscape:groupmode="layer" id="layer1" transform="translate(0,274.765)"> <path style="fill:none;fill-rule:evenodd;stroke:#000000;stroke-width:0.793751;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="M 436.694,-322.259 V 344.493" id="path10" inkscape:connector-curvature="0" /> <path style="fill:none;fill-rule:evenodd;stroke:#000000;stroke-width:0.793751;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none" d="M -58.6065,11.1175 H 931.996" id="path12" inkscape:connector-curvature="0" /> </g> </svg>

Increase the stroke-width of the paths. stroke-width:10 seems pretty opaque to me for instance.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM