notice-icon
from notice
notice-icon
https://svg-hosting.vercel.app/api/svg?url=https://scrapbox.io/api/code/suto3/notice-icon/notice.svg
code:notice.svg
<svg width="200" height="100" viewBox="0 0 200 100" xmlns="http://www.w3.org/2000/svg">
<g>
<style type="text/css">
#tx01{
fill: white;
stroke: gray;
stroke-width:2;
font-weight:900;
}
#f01{
stroke: gray;
stroke-width: 3;
fill-opacity: 0;
}
#f02{
stroke: white;
stroke-width: 3;
fill-opacity: 0;
}
/* @media (prefers-color-scheme: light) { /* */
@media (prefers-color-scheme: dark) { /* */
#tx01{
fill:gray;
stroke:white;
}
#f01{
stroke: gray;
}
#f02{
stroke: white;
}
}
</style>
<rect id="f01" x="5" y="5" width="190" height="90" rx="15" ry="15" />
<rect id="f02" x="8" y="8" width="184" height="84" rx="12" ry="12" />
<text id="tx01" x="35" y="70" font-size="40" letter-spacing="-2" word-spacing="-2" >
Notice
</text>
</g>
</svg>
https://svg-hosting.vercel.app/api/svg?url=https://scrapbox.io/api/code/suto3/notice-icon/n3.svg
code:n3.svg
<svg width="300" height="120" viewBox="0 0 300 100" xmlns="http://www.w3.org/2000/svg">
<g>
<style type="text/css">
#tx01{
fill: white;
stroke: gray;
stroke-width:3;
font-weight:900;
}
#f01{
stroke: gray;
stroke-width: 3;
fill-opacity: 0;
}
#f02{
stroke: white;
stroke-width: 3;
fill-opacity: 0;
}
/* @media (prefers-color-scheme: light) { /* */
@media (prefers-color-scheme: dark) { /* */
#tx01{
fill:gray;
stroke:white;
}
#f01{
stroke: gray;
}
#f02{
stroke: white;
}
}
</style>
<rect id="f01" x="5" y="5" width="290" height="90" rx="15" ry="15" />
<rect id="f02" x="8" y="8" width="284" height="84" rx="12" ry="12" />
<text id="tx01" x="15" y="80" font-size="80" letter-spacing="-2" word-spacing="1" >
Notice
</text>
</g>
</svg>