Hyperlink
Usually used for content that is not sufficiently displayed, link text is used to jump.
Anatomy
1: Text
Required, conveys the content of the link briefly, clearly, and accurately
1: Text
Required, conveys the content of the link briefly, clearly, and accurately
2: Underline
Required, ensure clear clickability
1
Hyperlink
1
2
Hyperlink
Variant/Type
Primary muted (noise-reduced) text link
Hyperlink
Accent basic text link:
Hyperlink
Usage scenario
Style Type
Goal
Recommended Scenarios
Risk Warning Level
Primary
Clarify clickability to reduce cognitive cost
Reduce noise
Links for "User Agreement" and "Privacy Policy"
More than three Links on the same-level page
Low
Accent
Keep the interface clean and reduce visual distractions
High-frequency operation guide: such as trading, asset management, login and registration
Middle
Type description:
Primary
Clearly clickable, reducing cognitive load and noise
Accent
Keep the interface clean, reducing visual distractions
Not suitable for:
If an action is triggered or a state is changed on the current page, a button component should be used instead of a link component.
Decision logic:
Does the link involve legal/fund risks? → Yes: Hyperlink
Do users need to quickly discover and operate it? → Yes: Hyperlink
Is it on the core process path? → Yes: Hyperlink
Are there more than 3 Links on the same level page? → Yes: Hyperlink
Interaction
Hyperlink
Default
Default state
Hyperlink
hover
User hovers the mouse over the hyperlink hotspot
Hyperlink
Disable
Indicates options that are currently non-interactive or unavailable.
RTL
Hyperlink
LTR
Hyperlink
RTL
Usage
I have read and agree to the User Agreement, DEX+ User Agreement and Privacy Policy
MEXC exchange account & DEX+ account will be opened soon
Do
I have read and agree to the User Agreement, DEX+ User Agreement and Privacy Policy
MEXC exchange account & DEX+ account will be opened soon
Don't
Inline links are used within a sentence or paragraph of text, defaulting to Primary, which helps distinguish them from surrounding text and allows users to interact with them clearly.
Email verification code
Please enter the 6-digit verification code for email yanci.z@mexc.com, valid for 15 minutes
9
5
5
2
6
Resend code in 56s
Sure
Switch to another verification option
Did not receive the verification code
Missing security items?
Do
Email verification code
Please enter the 6-digit verification code for email yanci.z@mexc.com, valid for 15 minutes
9
5
5
2
6
Resend code in 56s
Sure
Switch to another verification option
Did not receive the verification code
Missing security items?
Don't
On the core flow path and requiring quick operation, use Accent; underlining is prohibited for brand colors.
Text link
Hyperlink
Link text
Clickable link
URL link