Développeurs
Recettes CSS
Exemples compatibles basés sur les variables publiques NasDash.
Collez une recette à la fois, vérifiez les deux modes de couleur, puis combinez-les.
Accent cyan et cartes nettes
:root {
--nd-accent: #22d3ee;
--nd-accent-glow: rgba(34, 211, 238, 0.16);
--nd-accent-dim: rgba(34, 211, 238, 0.1);
--nd-card-border: rgba(34, 211, 238, 0.2);
--nd-card-hover-border: rgba(34, 211, 238, 0.48);
--nd-card-radius: 14px;
}Style doux et arrondi
:root {
--nd-card-radius: 22px;
--nd-blur: 20px;
--nd-card-shadow: 0 18px 60px rgba(0, 0, 0, 0.16);
--nd-transition: 180ms ease;
}Densité mobile
@media (max-width: 700px) {
:root {
--nd-card-radius: 12px;
--nd-blur: 6px;
--nd-card-bg-opacity: 0.96;
}
}Palette d'états accessible
:root {
--nd-green: #22c55e;
--nd-yellow: #eab308;
--nd-orange: #f97316;
--nd-red: #ef4444;
--nd-blue: #3b82f6;
--nd-purple: #a855f7;
}Ne vous reposez pas uniquement sur la couleur pour transmettre un état. Les libellés et icônes du produit doivent rester visibles.