Tailwind CSS Radio - Taco Tall Stack

Input fields are an essential user interface design element, providing users with the means to enter non-standardized responses. Below we are presenting dynamic examples of the Dialog component that you can use in your project based on Taco.



Code

Below you can find the code for the Radio component.


<x-input 
    type="radio" name="radio" value="pink" label="Pink"
    color="text-blue-500 checked:before:bg-blue-500" border="checked:border-blue-500"
    textColor="text-gray-700" 
/>

Below you can find an example radio:

<x-input 
    type="radio" value="blue" label="Blue" name="radio" 
    color="text-blue-500 checked:before:bg-blue-500" border="checked:border-blue-500" textColor="text-gray-700"
/>
<x-input 
    type="radio" value="red" label="Red" name="radio" 
    color="text-red-500 checked:before:bg-red-500" border="checked:border-red-500" textColor="text-gray-700"
/>
<x-input 
    type="radio" value="green" label="Green" name="radio" 
    color="text-green-500 checked:before:bg-green-500" border="checked:border-green-500" textColor="text-gray-700"
/>
<x-input 
    type="radio" value="amber" label="Amber" name="radio" 
    color="text-amber-500 checked:before:bg-amber-500" border="checked:border-amber-500" textColor="text-gray-700"
/>