Here is an example of a list styled using Tailwind CSS classes:

<ul class="list-none p-0">
    <li class="py-2 px-4 bg-gray-200 hover:bg-gray-400 rounded-lg">Item 1</li>
    <li class="py-2 px-4 bg-gray-200 hover:bg-gray-400 rounded-lg">Item 2</li>
    <li class="py-2 px-4 bg-gray-200 hover:bg-gray-400 rounded-lg">Item 3</li>
</ul>

In this example, the list-none class removes the default list style, the p-0 class removes the default padding from the list, the py-2 class adds padding to the top and bottom of the list items, the px-4 class adds padding to the left and right of the list items, the bg-gray-200 class sets the background color to a light gray, the hover:bg-gray-400 class sets the background color to a medium gray on hover, and the rounded-lg class adds rounded corners to the list items.

You can customize this list by modifying the classes used or by adding additional classes as needed. For example, you can use the font-bold class to make the list items text bold, or the text-gray-700 class to add a dark gray color to the list items text.

Here is an example of a customized list:

<ul class="list-none p-0">
    <li class="py-2 px-4 bg-pink-200 hover:bg-pink-400 rounded-lg font-bold text-gray-700">Item 1</li>
    <li class="py-2 px-4 bg-pink-200 hover:bg-pink-400 rounded-lg font-bold text-gray-700">Item 2</li>
</ul>

here is an example of an input styled using Tailwind CSS classes:

<label class="block font-bold text-gray-700 text-2xl mb-2">
    Input label
</label>
<input type="text"
       class="block w-full p-3 rounded-lg bg-gray-200 border-gray-300 focus:outline-none focus:bg-white focus:border-gray-500">