Tailwind CSS Radio

Our Tailwind CSS radio button component will let your users choose only one of a predefined set of mutually exclusive options. Radio buttons should be used instead of radioes if only one item can be selected from a list.

Use the following example to create simple radio buttons for your projects.

Radio Colors

Radio Ripple Effect

Required Scrips

The radio component needs a required script file for ripple effect to work, you just need to add the below script file to the bottom of your html file.

<!-- from node_modules -->
<script src="node_modules/@material-tailwind/[email protected]/scripts/ripple.js"></script>
<!-- from cdn -->
<script src="https://unpkg.com/@material-tailwind/[email protected]/scripts/ripple.js"></script>
Edit this page on Github