Css hexagon with text inside

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="800px" height="300" xmlns:xlink="http://www.w3.org/1999/xlink">
    <polygon class="hex" points="300,150 225,280 75,280 0,150 75,20 225,20" fill="#fa5" stroke="blue" stroke-width="5" transform="translate(10)"></polygon>
    <text x="160" y="160" 
        font-family="Verdana" 
        font-size="30"
        text-anchor="middle"
    >
    Any Text Here
    </text>  
</svg>

Source: stackoverflow.com

Css hexagon with text inside

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="900px" height="100" xmlns:xlink="http://www.w3.org/1999/xlink">
    <polygon class="hex" points="300,150 225,280 75,280 0,150 75,20 225,20" fill="#fa5" stroke="blue" stroke-width="5" transform="translate(10)"></polygon>
    <text x="160" y="160" 
        font-family="Verdana" 
        font-size="30"
        text-anchor="middle"
    >
    Any Text Here
    </text>  
</svg>

Source: stackoverflow.com

Similar codes

0 vote235 views1 answer
Añadir hojas css externas a wordpress
CSS
2 votes233 views1 answer
Kerning css
CSS
22 votes254 views2 answers
Disable user select css
CSS
0 vote247 views1 answer
Prevent css animation reset
CSS
-1 vote248 views1 answer
Add shadow to background image css
CSS
0 vote244 views1 answer
PacSelectFirst( submit button
CSS
0 vote247 views1 answer
React exact path highlight
CSS
7 votes265 views2 answers
Float center tailwind
CSS
0 vote215 views1 answer
Mat select remove underline
CSS
0 vote278 views1 answer
Scroll div when page scroll
CSS