Tailwind CSS User Select Last Updated : 23 Jul, 2025 Suggest changes Share 2 Likes Like Report This class accepts lots of value in tailwind CSS in which all the properties are covered as a class form. This class is used to specify whether the text can be selected by the user or not. In CSS, we do that by using the CSS user-select property. User Select classes select-none: This class is used to deny the selection of any text.select-text: This class is used to select single text.select-all: This class is used to select the whole statement.select-auto: This class is used to set the default behavior. Syntax: <element class="select-{effect}">...</element> Example: HTML <!DOCTYPE html> <html> <head> <link href= "https://unpkg.com/tailwindcss@1.9.6/dist/tailwind.min.css" rel="stylesheet"/> </head> <body class="text-center mx-4 space-y-2"> <h1 class="text-green-600 text-5xl font-bold"> GeeksforGeeks </h1> <b>Tailwind CSS User Select Class</b> <div class="mx-14 bg-green-200 grid grid-rows-2 grid-flow-col text-justify p-2 gap-2"> <p class="bg-green-400 p-2 select-none"> User Select: select-none </p> <p class="bg-yellow-400 p-2 select-text"> User Select: select-text </p> <p class="bg-purple-400 p-2 select-all"> User Select: select-all </p> <p class="bg-blue-800 p-2 select-auto"> User Select: select-auto </p> </div> </body> </html> Output: S skyridetim Follow 2 Article Tags : Web Technologies CSS Tailwind CSS Tailwind-Interactivity Explore CSS Introduction 3 min read CSS Syntax 2 min read CSS Selectors 6 min read CSS Comments 2 min read CSS Colors 5 min read CSS Borders 5 min read CSS Margins 4 min read CSS Height and Width 4 min read CSS Outline 4 min read CSS Fonts 4 min read My Profile ${profileImgHtml} My Profile Edit Profile My Courses Join Community Transactions Logout Like