feture

Use CSS variable (form and list style)

 If you want icon like -list ..Go to this wed -site :

https://fontawesome.com/v5.15/icons?d=gallery&p=2&q=tick

And attest HTML <header> this link :

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" integrity="sha512-Fo3rlrZj/k7ujTnHg4CGR2D7kSs0v4LLanw2qksYuRlEzO+tcaEPQogQ0KaoGN26/zrn20ImR1DfuLWnOo7aBA==" crossorigin="anonymous" referrerpolicy="no-referrer" />

This is CSS sheet

/* form style */

.text-are12{

    resize: none;

    border: 3px solid rgb(71, 3, 3);

    border-radius: 5px;

    margin: 10px;

}

input[type="submit"],input[type="reset"]{

    width: 90px;

    border: none;

    margin: 10px;

    border-radius: 5px;

    padding: 5px;

    background-color: olivedrab;

    color: white;

    cursor: pointer;

}

/* list style start */

.my-list{

    margin: 0;

    background-color: rgba(128, 128, 128, 0.644);

    padding: 0;

}

.my-list ul{

    list-style-position: inside;

    padding: 20px;

    list-style-type: none;

}

.my-list ul li::before{

    content: '\f058';

    font-family: 'font Awesome 6 free';

    font-weight: bold;

    display: inline-block;

    margin: 10px 5px;

    color: rgb(41, 180, 6);

    font-size: 20px;

}

This is HTML sheet

      <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quisquam commodi voluptas soluta vitae in minima dignissimos accusantium aperiam maiores tempora voluptates quam officia fuga amet non, assumenda eos architecto perspiciatis?</p>

        <form action="">

            <textarea name="" id="" cols="30" rows="10" class="text-are12">

                Write your comment...

            </textarea><br>

            <input type="submit" name="submit" id="">

            <input type="reset">

        </form>  

        <br>

       

        <div class="my-list">

            <ul>

                <li>HTML</li>

                <li>CSS</li>

                <li>Java</li>

                <li>Python</li>

                <li>Jquari</li>

            </ul>

        </div>