new·The score now tells you which way it movedA brain's exam only ever grows: its own material writes questions, and so does every question a real caller asked and did not get answered. The score is a percentage over that growing set, so a brain that learned more could post a smaller number — and this week three did. One of them answered two MORE questions than the week before and showed eighteen points less. Printed as a single percentage, that reads as decline to a reader and as punishment to anyone who contributes material.all news →
mozg.beta
Sign in

Tailwind CSS · Utilities reference · all subjects

filter-drop-shadow

18 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.

drop-shadow with arbitrary value

The drop-shadow-[<value>] syntax allows using an arbitrary value with filter: drop-shadow(<value>);

drop-shadow-inherit utility

The drop-shadow-inherit utility sets --tw-drop-shadow-color: inherit;

drop-shadow-current utility

The drop-shadow-current utility sets --tw-drop-shadow-color: currentColor;

drop-shadow-transparent utility

The drop-shadow-transparent utility sets --tw-drop-shadow-color: transparent;

drop-shadow with color name utilities

Drop shadow utilities support color names like drop-shadow-cyan-500, drop-shadow-indigo-500, etc., which set --tw-drop-shadow-color: var(--color-<name>);

drop-shadow opacity modifier

Drop shadow utilities support opacity modifiers using the slash syntax, such as drop-shadow-xl/25 and drop-shadow-xl/50, to adjust the opacity of the drop shadow.

drop-shadow color opacity modifier

Colored drop shadows support opacity modifiers such as drop-shadow-cyan-500/50 and drop-shadow-indigo-500/50. By default colored shadows have an opacity of 100%.

drop-shadow responsive design

Drop shadow utilities support responsive variants using Tailwind's responsive breakpoint prefixes.

drop-shadow dark mode support

Drop shadow utilities support the dark: variant for styling in dark mode, such as dark:drop-shadow-none.

drop-shadow for irregular shapes

Drop shadow is useful for applying shadows to irregular shapes like text and SVG elements. For applying shadows to regular elements, box-shadow is preferred.

drop-shadow custom value syntax

Custom drop shadow values can be applied using the drop-shadow-[<value>] syntax, such as drop-shadow-[0_35px_35px_rgba(0,0,0,0.25)].

drop-shadow-sm utility

The drop-shadow-sm utility applies filter: drop-shadow(var(--drop-shadow-sm)); which produces 0 1px 2px rgb(0 0 0 / 0.15).

drop-shadow-md utility

The drop-shadow-md utility applies filter: drop-shadow(var(--drop-shadow-md)); which produces 0 3px 3px rgb(0 0 0 / 0.12).

drop-shadow-lg utility

The drop-shadow-lg utility applies filter: drop-shadow(var(--drop-shadow-lg)); which produces 0 4px 4px rgb(0 0 0 / 0.15).

drop-shadow-2xl utility

The drop-shadow-2xl utility applies filter: drop-shadow(var(--drop-shadow-2xl)); which produces 0 25px 25px rgb(0 0 0 / 0.15).

drop-shadow-none utility

The drop-shadow-none utility applies filter: drop-shadow(0 0 #0000); to remove an existing drop shadow.

drop-shadow with custom property

The drop-shadow-(<custom-property>) syntax allows using a custom CSS property with filter: drop-shadow(var(<custom-property>));

drop-shadow with custom property for color

The drop-shadow-(color:<custom-property>) syntax sets --tw-drop-shadow-color: var(<custom-property>);

Give your agent this brain