Skip to main content
const borderRadiusComponents: {
  badge: {
     value: "{borderRadius.full}";
  };
  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

NameTypeDefault value
badge{ value: "{borderRadius.full}"; }-
badge.value"{borderRadius.full}""{borderRadius.full}"
banner{ value: "{borderRadius.lg}"; }-
banner.value"{borderRadius.lg}""{borderRadius.lg}"
cta{ value: "{borderRadius.full}"; }-
cta.value"{borderRadius.full}""{borderRadius.full}"
input{ value: "{borderRadius.sm}"; }-
input.value"{borderRadius.sm}""{borderRadius.sm}"
link{ value: "{borderRadius.full}"; }-
link.value"{borderRadius.full}""{borderRadius.full}"
modal{ value: "{borderRadius.sm}"; }-
modal.value"{borderRadius.sm}""{borderRadius.sm}"
select{ trigger: { value: "{borderRadius.sm}"; }; list: { value: "{borderRadius.sm}"; }; }-
select.trigger{ value: "{borderRadius.sm}"; }-
select.trigger.value"{borderRadius.sm}""{borderRadius.sm}"
select.list{ value: "{borderRadius.sm}"; }-
select.list.value"{borderRadius.sm}""{borderRadius.sm}"