Articles by

Mojtaba Seyedi

Direct link to the article outline-color

outline-color

The outline-color CSS property specifies the color of an element’s outline. What’s an outline? An outline is a line that is drawn around elements — outside the border edge — that is used for accessibility or decoration purposes when that …

Direct link to the article outline-style

outline-style

The outline-style CSS property specifies the style of an element’s outline. What’s an outline? An outline is a line that is drawn around elements — outside the border edge — that is used for accessibility or decoration purposes when that …

Direct link to the article outline-width

outline-width

The outline-width CSS property specifies the thickness of an element’s outline. What’s an outline? An outline is a line that is drawn around elements — outside the border edge — that is used for accessibility or decoration purposes when that …

(Updated on )
Direct link to the article ::backdrop

::backdrop

The ::backdrop CSS pseudo-element creates a backdrop that covers the entire viewport and is rendered immediately below a <dialog> or any element that enters fullscreen mode using the Fullscreen API.

dialog::backdrop {
  background-color: darkorange;
}
The backdrop is selectable…
Direct link to the article :fullscreen

:fullscreen

The :fullscreen CSS pseudo-class allows you to select and style any element that is currently in fullscreen mode. You know those times you allow an image or some other element to take up the full screen? Well, we can style …

(Updated on )
Direct link to the article mask

mask

The mask property is a shorthand to specify all mask-* properties. mask can hide part of the element is applied to and It accepts one or more comma-separated values, where each value corresponds to a mask layer.

.element {
  mask: 
(Updated on )

mask-composite

The mask-composite CSS property allows us to combine a mask layer image with the mask layers below it.

.element {
  mask-composite: subtract;
}

When there are multiple mask layer images, they need to be composited into one final mask layer. mask-compositespecifies how …

(Updated on )

mask-type

The mask-type CSS property indicates whether the SVG <mask> element is treated as an alpha mask or a luminance mask.

mask {
  mask-type: alpha;
}

When the mask layer is an image or a gradient, a mask-mode property can be …

(Updated on )

mask-mode

The mask-mode CSS property indicates whether the CSS mask layer image is treated as an alpha mask or a luminance mask.…

(Updated on )