topic Re: How to create a calcite button that looks like a link? in Calcite Design System Questions

How to create a calcite button that looks like a link?

ForrestLin — Wed, 03 Jul 2024 19:05:17 GMT

How to create a calcite button that looks like a link?

Re: How to create a calcite button that looks like a link?

KittyHurley — Sun, 07 Jul 2024 22:15:15 GMT

@ForrestLin You can use CSS to fit your use case, perhaps something like: https://codepen.io/geospatialem/pen/gONOLVG

Re: How to create a calcite button that looks like a link?

ForrestLin — Mon, 08 Jul 2024 13:20:15 GMT

@KittyHurley

Thank you!

Re: How to create a calcite button that looks like a link?

ACrateau — Tue, 24 Mar 2026 17:41:39 GMT

@KittyHurley Is it possible to use the same logic to increase the default font size and weight of a button's text? I'm trying the same approach you provided here and adding the CSS properties font-weight and font-size, but the renderer is ignoring them - any thoughts?

Re: How to create a calcite button that looks like a link?

KittyHurley — Thu, 02 Apr 2026 18:39:51 GMT

@ACrateau Yes, you can do so using the --calcite-font-size-relative-base and --calcite-font-weight-normal (deprecated) tokens: https://codepen.io/geospatialem/pen/ZYpayqW.

#custom-btn { --calcite-font-size-relative-base: var(--calcite-font-size-relative-lg); /* Note that --calcite-font-weight-normal is deprecated, but still supported in Button */ --calcite-font-weight-normal: var(--calcite-font-weight-bold); }

While --calcite-font-weight-normal is supported it is deprecated, but the team is working on support for the replacement --calcite-font-weight-regular token soon. Additional information can be sought and followed via issue #14190.