You can do this:

@theme {
  --default-border-width: 3px;
}

https://play.tailwindcss.com/jLZbGAtAAj

You can apply border-width of 2px only to the top edge according to the documentation as following

<div class="border-t-2 border-blue-900">foo</div>

The error made was there is no utility class called border-t-1 in tailwind-CSS. Also applying border utility class adds the the CSS styling of border-width: 1px; which adds a border-width to all sides.

Check out the solution at tailwind playground

EDIT: Check out shingo.nakanishi's answer top apply border-top-width of 1px if you are using JIT mode

border utility is one of specific "multipurpose" Tailwind's utilities which may represent either color or width. Tailwind may resolve arbitrary value itself - however if it cannot be done (like with variables) you should help him with some "type" keyword.

This is documented in the "Resolving Ambiguities" guide. Within Tailwind's source code we can see that in case of borders, the width is controlled by length or line-width (line 1462) "hints". So your class should be like

<div class="border-x-[length:var(--tri-base)]"></div>

<!-- or -->
<div class="border-x-[line-width:var(--tri-base)]"></div>

DEMO