Skip to content

Instantly share code, notes, and snippets.

@Funlang
Forked from csssecrets/dabblet.css
Created November 14, 2020 02:37
Show Gist options
  • Select an option

  • Save Funlang/716d203bcb0deb5b10b07e36d5d910be to your computer and use it in GitHub Desktop.

Select an option

Save Funlang/716d203bcb0deb5b10b07e36d5d910be to your computer and use it in GitHub Desktop.
Text on a circle
/**
* Text on a circle
*/
body {
font: bold 120% Helvetica, sans-serif;
}
.circular {
width: 30em;
height: 30em;
margin: 4em auto 0;
}
.circular svg {
display: block;
overflow: visible;
transition: 10s linear transform;
}
.circular svg:hover { transform: rotate(-2turn); }
.circular text { fill: currentColor }
.circular path { fill: none; }
<div class="circular">
circular reasoning works because
</div>
{"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment