Semantic-UI Loader Active State Last Updated : 20 Feb, 2022 Summarize Comments Improve Suggest changes Share Like Article Like Report Semantic UI is an open-source development framework that provides pre-defined classes to make our website look beautiful, amazing, and responsive. It is similar to Bootstrap which has predefined classes. It uses jQuery and CSS to create interactive interfaces. It can also be directly used via CDN like bootstrap. Semantic-UI Loader Active State is used to display the loader that can be active or visible. Used Class: active: This class is used to display the active state of a loader. Syntax: <div class="ui segment"> <div class="ui active loader"></div> </div> Example 1: This example describes the Loader Active State. HTML <!DOCTYPE html> <html> <head> <title> Semantic-UI Loader Active State </title> <link rel="stylesheet" href= "https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.css" /> <style> .ui.segment { padding: 50px 0; } </style> </head> <body> <div class="ui container center aligned"> <h2 style="color:green"> GeeksforGeeks </h2> <h3>Semantic-UI Loader Active State</h3> <div class="ui segment"> <div class="ui active dimmer"> <div class="ui text loader"> GeeksforGeeks Loading... </div> </div> </div> </div> </body> </html> Output: Example 2: This example describes the Loader Active State. HTML <!DOCTYPE html> <html> <head> <title> Semantic-UI Loader active States </title> <link rel="stylesheet" href= "https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.css" /> <style> .ui.segment { padding: 50px 0; } </style> </head> <body> <div class="ui container center aligned"> <h2 style="color:green"> GeeksforGeeks </h2> <h3>Semantic-UI Loader active States</h3> <div class="ui segment"> <div class="ui active loader"></div> </div> </div> </body> </html> Output: Reference: https://semantic-ui.com/elements/loader.html#active Comment More infoAdvertise with us Next Article Semantic-UI Loader States A ashokjaiswal Follow Improve Article Tags : Web Technologies CSS Geeks Premier League Geeks-Premier-League-2022 Semantic-UI Semantic-UI Elements +1 More Similar Reads Semantic-UI Dimmer Active State Semantic UI is an open-source UI framework that uses CSS and jQuery to enable developers to develop great web experiences faster. It can also be used with other CSS frameworks like Bootstrap. A Dimmer module is used to make the user focus on specific content and dims the other distractions. In this 2 min read Semantic-UI Modal Active State Semantic UI is an open-source framework that uses CSS and jQuery to build great user interfaces. It is the same as a bootstrap for use and has great different elements to use to make your website look more amazing. Semantic UI Modal displays content above the screen that temporarily blocks interacti 2 min read Semantic-UI Menu Active State Semantic UI open-source framework gives icons or glyphs that are used to show pictures related to some elements using CSS and jQuery that is used to create great user interfaces. It is a development framework used to create beautiful and responsive layouts. Semantic UI Menu is a group of elements th 2 min read Semantic-UI Loader States Semantic UI is an open-source development framework that provides pre-defined classes to make our website look beautiful, amazing, and responsive. It is similar to Bootstrap which has predefined classes. It uses jQuery and CSS to create interactive interfaces. It can also be directly used via CDN li 2 min read Semantic-UI Breadcrumb Active State Semantic UI is a free-to-use open-source framework that offers multiple classes to create beautiful and responsive UI. It makes use of jQuery and CSS to create amazing UI which are much similar to bootstrap. It has many classes which are used for styling different elements in the HTML web page struc 2 min read Semantic-UI Loader Disabled State Semantic UI is an open-source development framework that provides pre-defined classes to make our website look beautiful, amazing, and responsive. It is similar to Bootstrap which has predefined classes. It uses jQuery and CSS to create interactive interfaces. It can also be directly used via CDN li 2 min read Like