Files

17 lines
1.0 KiB
CSS

:root{
/* The CORNER knob — one multiplier on every rung below but the pill, the way
--type-scale is on type and --density on spacing. @hanzo/ui's gui radii
multiply by the same name, so a component and a stylesheet stay round
together. 1 is the published set. */
--radius-scale:1;
--radius:calc(0.5rem * var(--radius-scale, 1)); /* the base token (globals.css) */
--radius-sm:calc(0.375rem * var(--radius-scale, 1)); /* rounded-md — buttons, inputs */
--radius-md:calc(0.5rem * var(--radius-scale, 1));
--radius-lg:calc(0.75rem * var(--radius-scale, 1)); /* rounded-xl — cards */
--radius-xl:calc(1rem * var(--radius-scale, 1)); /* rounded-2xl — dropdown panels */
--radius-2xl:calc(1.5rem * var(--radius-scale, 1)); /* rounded-3xl — story / hero cards */
--radius-composer:calc(28px * var(--radius-scale, 1)); /* the chat composer, 28px at scale 1 */
--radius-full:9999px; /* pills, CTAs, avatars, badges — a shape, so never scaled */
}