Tag an element as a container to let children adapt to changes in its size.
Tailwind uses CSS layers so you don’t have to worry about specificity issues.
@layer theme, base, components, utilities;
@layer theme {:root {
/* Your theme variables */
}
}
@layer base { /* Preflight styles */
}
@layer components { /* Your custom components */
}
@layer components { /* Your custom components */
}Supporting multiple language text directions is no longer a nightmare.
Tag an element as a container to let children adapt to changes in its size.
<div class="@container">
<div class="grid grid-cols-1 @sm:grid-cols-2">
<img
src="/img/photo-1.jpg"
class="aspect-square @sm:aspect-3/2 object-cover"
/>
<img
src="/img/photo-2.jpg"
class="aspect-square @sm:aspect-3/2 object-cover"
/>
<img
src="/img/photo-3.jpg"
class="aspect-square @sm:aspect-3/2 object-cover"
</div>
</div>What’s a website these days without a few backdrop blurs? Keep stacking filters until your designer asks you to please, please stop.
If you’re not a fan of burning your retinas, just stick dark: in front of any color to apply it in dark mode.
Using grid utilities directly in your HTML makes it so much easier to reason about complex layouts.
Sometimes two dimensions aren’t enough. Scale, rotate, and translate any element in 3D space to add a touch of depth.
Transitions that work the way you'd expect — throw a few utilities on an element and you're in business.
No need to remember that complicated gradient syntax — create silky-smooth gradients with just a few utility classes.
Customizing your theme is as simple as creating a few CSS variables.
@theme {
--font-sans: "Inter", sans-serif;
--font-mono: "IBM Plex Mono", monospace;
--text-tiny: 0.625rem;
--text-tiny--line-height: 1.5rem;
--color-mint-100: oklch(0.97 0.15 145);
--color-mint-200: oklch(0.92 0.18 145);
--color-mint-300: oklch(0.85 0.22 145);
--color-mint-400: oklch(0.78 0.25 145);
--color-mint-500: oklch(0.7 0.28 145);
--color-mint-600: oklch(0.63 0.3 145);
--color-mint-700: oklch(0.56 0.32 145);
--color-mint-800: oklch(0.48 0.35 145);
--color-mint-900: oklch(0.4 0.37 145);
}The color palette now uses more vibrant wide gamut colors without you needing to understand what any of that even means.
Hier is wat sommige van onze klanten te zeggen hebben over Reactly.
We staan voor je klaar om je te helpen met al je vragen. Kun je niet vinden wat je zoekt? Neem contact met ons op via info@reactly.nl
Lease uw zakelijke financial lease auto bij BeterLease.nl Met onze jaren ervaring als financial lease expert zijn wij dé leasepartner voor ondernemers en maken wij zakelijk leasen betaalbaar en eenvoudig. Kies uit financial lease, operational lease, equipment lease of private lease. Onze leaseadviseurs helpen u graag bij het vinden van de beste leasevorm en leaseauto die past bij uw wensen en ambities.
We staan voor je klaar om je te helpen met al je vragen. Kun je niet vinden wat je zoekt? Neem contact met ons op via info@reactly.nl
