<script lang="ts"></script>

<div>
	Hello
	<div>
		<h4>HTML</h4>
		<div class="round_base">
			<div class="inside"><div>percentage</div></div>
		</div>
	</div>
</div>

<style lang="scss">
	.round_base {
		width: 100px;
		height: 100px;
		background-color: yellow;
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		outline: 0.1px solid black;
		background-image: linear-gradient(to right, transparent 40px, #000000 2px);
	}
	.inside {
		width: 80px;
		height: 80px;
		background-color: white;
		border-radius: 50%;
		text-align: center;
		vertical-align: middle;
		outline: 0.1px solid black;
		display: flex;
		align-items: center;
		justify-content: center;
	}
</style>
