Skip to content

Instantly share code, notes, and snippets.

@jackmcdade
Created August 22, 2018 19:48
Show Gist options
  • Save jackmcdade/8b491b8966cf86dee9f69608fa975d1d to your computer and use it in GitHub Desktop.
Save jackmcdade/8b491b8966cf86dee9f69608fa975d1d to your computer and use it in GitHub Desktop.
My Tailwind Utilties
/* Blend Modes
========================================================================== */
.mix-overlay { mix-blend-mode: overlay; }
.mix-multiply { mix-blend-mode: multiply; }
.mix-screen { mix-blend-mode: screen; }
.mix-lighten { mix-blend-mode: lighten; }
.mix-soft-light { mix-blend-mode: soft-light; }
.mix-difference { mix-blend-mode: difference; }
.mix-color { mix-blend-mode: color; }
/* Filters
========================================================================== */
@variants hover, group-hover {
.grayscale-100 { filter: grayscale(100%); }
.grayscale-0 { filter: grayscale(0%); }
}
/* Object Fit
========================================================================== */
.fit-cover { object-fit: cover; }
.fit-contain { object-fit: contain; }
/* Position
========================================================================== */
.sticky { position: sticky; }
/* Visibility
========================================================================== */
[v-cloak] { display: none; }
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment