Skip to main content
const borderRadiusComponents: {
  banner: {
     value: "{borderRadius.lg}";
  };
  cta: {
     value: "{borderRadius.full}";
  };
  input: {
     value: "{borderRadius.sm}";
  };
  link: {
     value: "{borderRadius.full}";
  };
  modal: {
     value: "{borderRadius.sm}";
  };
  select: {
     trigger: {
        value: "{borderRadius.sm}";
     };
     list: {
        value: "{borderRadius.sm}";
     };
  };
};
Component border radius tokens.

Type declaration

readonly banner: {
  value: "{borderRadius.lg}";
};

Type declaration

readonly value: "{borderRadius.lg}" = "{borderRadius.lg}";

cta

readonly cta: {
  value: "{borderRadius.full}";
};

Type declaration

cta.value

readonly value: "{borderRadius.full}" = "{borderRadius.full}";

input

readonly input: {
  value: "{borderRadius.sm}";
};

Type declaration

input.value

readonly value: "{borderRadius.sm}" = "{borderRadius.sm}";
readonly link: {
  value: "{borderRadius.full}";
};

Type declaration

readonly value: "{borderRadius.full}" = "{borderRadius.full}";
readonly modal: {
  value: "{borderRadius.sm}";
};

Type declaration

readonly value: "{borderRadius.sm}" = "{borderRadius.sm}";

select

readonly select: {
  trigger: {
     value: "{borderRadius.sm}";
  };
  list: {
     value: "{borderRadius.sm}";
  };
};

Type declaration

select.trigger

readonly trigger: {
  value: "{borderRadius.sm}";
};
Type declaration

select.trigger.value

readonly value: "{borderRadius.sm}" = "{borderRadius.sm}";

select.list

readonly list: {
  value: "{borderRadius.sm}";
};
Type declaration

select.list.value

readonly value: "{borderRadius.sm}" = "{borderRadius.sm}";