Yieldex — Income on your terms

01 / A

Buttons

4 hierarchies · 3 sizes · 6 states. Pill geometry, label 500, ikon 20 px, gap 8 px.

Primary / top → bottom

green-1 → green-2 → green-3
Label #092011 · 500

Accent / top → bottom

purple-1 → purple-2 → purple-3
Label #FFFFFF · 500

State hover, pressed, dan focus di matriks adalah spesimen visual. Coba interaksi sesungguhnya pada playground di bawah.

primary

Core actions

LG 48 px · padding 28 · label 16

Default

Hover

Pressed

Focus

Disabled

Loading

MD 40 px · padding 24 · label 14

Default

Hover

Pressed

Focus

Disabled

Loading

SM 32 px · padding 16 · label 13

Default

Hover

Pressed

Focus

Disabled

Loading

accent

Entry & intelligence

LG 48 px · padding 28 · label 16

Default

Hover

Pressed

Focus

Disabled

Loading

MD 40 px · padding 24 · label 14

Default

Hover

Pressed

Focus

Disabled

Loading

SM 32 px · padding 16 · label 13

Default

Hover

Pressed

Focus

Disabled

Loading

outline

Secondary actions

LG 48 px · padding 28 · label 16

Default

Hover

Pressed

Focus

Disabled

Loading

MD 40 px · padding 24 · label 14

Default

Hover

Pressed

Focus

Disabled

Loading

SM 32 px · padding 16 · label 13

Default

Hover

Pressed

Focus

Disabled

Loading

ghost

Tertiary actions

LG 48 px · padding 28 · label 16

Default

Hover

Pressed

Focus

Disabled

Loading

MD 40 px · padding 24 · label 14

Default

Hover

Pressed

Focus

Disabled

Loading

SM 32 px · padding 16 · label 13

Default

Hover

Pressed

Focus

Disabled

Loading

Interaction playground

Klik atau gunakan Tab + Enter/Space. Loading menolak klik tambahan.

Coba tombol, keyboard, dan state form. Tidak ada transaksi yang dikirim. Submit count: 0

01 / B

Form controls

Field 48 px · radius 12 px. Klik untuk focus, isi untuk filled, atau ganti state bersama.

Form state

Listing reference

Use a clear reference.

Password

Keep your account secure.

Price

DemoUSD

SIMULATED · Sepolia≈ 90.00 USD · IllustrativeBalance: 90.00 DemoUSD (contoh)

Backing asset

Token simulasi; pilihan ini hanya contoh UI.

Income share25%

0%100%

Principal stays with you.

Term length

1m3m6m12m

Starts at purchase.

I understand all tokens are simulated.

Required before continuing.

Activity alerts

Receive transaction updates (contoh UI).

Verification code

Contoh input saja; tidak mengirim kode.

Find a listing

Search assets or listing IDs (contoh UI).

01 / C

Foundations

Green untuk aksi utama. Purple untuk wallet dan AI. Yellow dan danger untuk status.

canvas

canvas-deep

card

raised

tint

border

text-1

text-2

text-3

green-1

green-2

green-3

green-text

purple-1

purple-2

purple-3

yellow

danger

input-border

primary-label

Inter · self-hosted

Income, on your terms.

Keep your principal.

Trade time-limited income rights

90.00 DemoUSD · tabular numbers

01 / D

Iconography

40 ikon lokal · 20 × 20 px · stroke 1.5 px. Asset dan nama dipakai bersama di semua komponen.

alert-triangle

arrow-left

arrow-right

arrow-up-right

bell

check-circle

check

chevron-down

chevron-left

chevron-right

clock

coins

copy

external-link

eye-off

eye

filter

globe

history

info

key

layers

lock

log-out

mail

plus

receipt

refresh

search

settings

shield-check

sparkles

swap

tag

trash

unlock

user

vault

wallet

x