frutjam/dist/components/link.css

A utility-first CSS UI Library for Tailwind CSS

/*! frutjam v2.2.1 (c) 2026 Nezanuha | Released under the MIT License | https://frutjam.com */
/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */.link{--link--color:currentColor;cursor:pointer;color:var(--link--color);font-size:var(--link-text-size,1rem);text-decoration:none;background-image:linear-gradient(currentColor,currentColor);background-position:0 100%;background-repeat:no-repeat;background-size:100% 1px;transition:opacity .2s ease-out;&:hover{@media (hover:hover){opacity:.65}}@media (forced-colors:active){text-decoration:underline}&:focus{outline-style:none;@media (forced-colors:active){outline:2px solid transparent;outline-offset:2px}}&:focus-visible{outline:2px solid currentColor;outline-offset:2px}}.link-hover{background-position:100% 100%;background-size:0 1.5px;transition:background-size .3s ease,background-position 0s,color .2s ease-out;&:hover{@media (hover:hover){background-position:0 100%;background-size:100% 1px;transition:background-size .3s ease,background-position 0s,color .2s ease-out}}}.link-accent{color:light-dark(var(--color-accent-800),var(--color-accent-400));&:hover{@media (hover:hover){color:light-dark(var(--color-accent-700),var(--color-accent-300));opacity:1}}}.link-error{color:light-dark(var(--color-error-800),var(--color-error-400));&:hover{@media (hover:hover){color:light-dark(var(--color-error-700),var(--color-error-300));opacity:1}}}.link-info{color:light-dark(var(--color-info-800),var(--color-info-400));&:hover{@media (hover:hover){color:light-dark(var(--color-info-700),var(--color-info-300));opacity:1}}}.link-neutral{color:light-dark(var(--color-neutral-800),var(--color-neutral-400));&:hover{@media (hover:hover){color:light-dark(var(--color-neutral-700),var(--color-neutral-300));opacity:1}}}.link-primary{color:light-dark(var(--color-primary-800),var(--color-primary-400));&:hover{@media (hover:hover){color:light-dark(var(--color-primary-700),var(--color-primary-300));opacity:1}}}.link-secondary{color:light-dark(var(--color-secondary-800),var(--color-secondary-400));&:hover{@media (hover:hover){color:light-dark(var(--color-secondary-700),var(--color-secondary-300));opacity:1}}}.link-success{color:light-dark(var(--color-success-800),var(--color-success-400));&:hover{@media (hover:hover){color:light-dark(var(--color-success-700),var(--color-success-300));opacity:1}}}.link-warning{color:light-dark(var(--color-warning-800),var(--color-warning-400));&:hover{@media (hover:hover){color:light-dark(var(--color-warning-700),var(--color-warning-300));opacity:1}}}.link-2xl{--link-text-size:1.375rem}.link-lg{--link-text-size:1.125rem}.link-md{--link-text-size:1rem}.link-sm{--link-text-size:0.875rem}.link-xl{--link-text-size:1.25rem}.link-xs{--link-text-size:0.75rem}