<!DOCTYPE html>
<
html
lang
=
"en"
>
<
head
>
<
meta
charset
=
"UTF-8"
>
<
meta
name
=
"viewport"
content
=
"width=device-width, initial-scale=1.0"
>
<
title
>Rounded Card</
title
>
</
head
>
<
body
class
=
"text-center mx-4 space-y-4"
>
<
h1
class
=
"text-green-600 text-5xl font-bold"
>
GeeksforGeeks
</
h1
>
<
div
class="mx-24 bg-green-400
text-justify px-12 rounded-full">
<
h3
class
=
"text-2xl text-center"
>
Full Rounded Corners
</
h3
>
<
ul
class
=
"list-disc"
>
<
li
>HTML</
li
>
<
li
>CSS</
li
>
<
li
>Javascript</
li
>
</
ul
>
</
div
>
<
div
class="mx-24 bg-green-400
text-justify px-8 rounded-t-lg">
<
h3
class
=
"text-2xl text-center"
>
Top Rounded Corners
</
h3
>
<
ul
class
=
"list-disc"
>
<
li
>HTML</
li
>
<
li
>CSS</
li
>
<
li
>Javascript</
li
>
</
ul
>
</
div
>
<
div
class="mx-24 bg-green-400
text-justify px-8 rounded-r-lg">
<
h3
class
=
"text-2xl text-center"
>
Right Rounded Corners
</
h3
>
<
ul
class
=
"list-disc"
>
<
li
>HTML</
li
>
<
li
>CSS</
li
>
<
li
>Javascript</
li
>
</
ul
>
</
div
>
<
div
class="mx-24 bg-green-400
text-justify px-8 rounded-b-lg">
<
h3
class
=
"text-2xl text-center"
>
Bottom Rounded Corners
</
h3
>
<
ul
class
=
"list-disc"
>
<
li
>HTML</
li
>
<
li
>CSS</
li
>
<
li
>Javascript</
li
>
</
ul
>
</
div
>
<
div
class="mx-24 bg-green-400
text-justify px-8 rounded-l-lg">
<
h3
class
=
"text-2xl text-center"
>
Left Rounded Corners
</
h3
>
<
ul
class
=
"list-disc"
>
<
li
>HTML</
li
>
<
li
>CSS</
li
>
<
li
>Javascript</
li
>
</
ul
>
</
div
>
</
body
>
</
html
>