1. Plugins
  2. Remove Element


Tailwind CSS Remove Element

Dismiss any content.

Remove Element


To get started, install Remove Element plugin via npm, else you can skip this step if you are already using Preline UI as a package.

                        npm i @preline/remove-element


Remove card with a dismissable button.

Remove element card

No new emails

Looks like you haven't received any emails.

Basic usage

Prefer to create your own style? Here is a completely unstylized example.

                        <div id="dismiss-unstyled" class="inline-flex justify-between items-center w-full">
                            Remove element card
                          <button type="button" class="inline-flex justify-center items-center size-4" data-hs-remove-element="#dismiss-unstyled">
                            <span class="sr-only">Close</span>
                            <svg class="flex-shrink-0 size-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>


Name Description Options Default value
data-hs-remove-element The element to be removed. This must be a valid selector. null
data-hs-remove-element-options Options that can be added via the data attribute.
:removeTargetAnimationClass Some valid CSS class. string hs-removing

Demo examples

Looking for prebuilt UI components based on the Tailwind CSS? Preline UI packs hundreds of component examples for all your website needs.

Image Description
Check out Preline UI Dismiss