Button Size There are four different sizes of buttons, the difference on the component is the height.

Size	Height	Component
X Small	28px	comming soon
Small	36px	comming soon
Medium	48px	ButtonMedium
Large	56px	comming soon

Button Attribute

Attribute	Code	Values
Button-Color	color={'text-black'}	color values
Button-Type	type={'rect'}	see below

Type	Preview
type={'rect'}	🤍
type={'pill'}	🤍
type={'square'}	🤍
type={'circle'}	🤍

Example: ⚔️ <ButtonSmall type={'rect'} color={'bg-green-600'}>⚔️</ButtonMedium> Button Content Text content: <ButtonMedium type="pill"> <ButtonMediumText content={'Hello World'}/> </ButtonMedium> import Content from './../content.svelte'; Text Attribute If type is custom you can change all types, if not you can only change the color.

Attribute	Code	Values
Text-Color	color={'text-black'}	color values
Text-Type	type={'h1'}	see below

Type	Preview
type={'h1'}	H1
type={'h2'}	H2
type={'custom'}	Custom text
type={''}	Normal text

Text Content <Text type={'custom'} size={'text-[16px]'} weight={'700'} color={'text-orange-700'}>Hello World</Text>