Link

Maps to Arco Link. The default keeps Element Plus neutral text; type="primary" matches Arco's default link. See the Element Plus docs for props.

Types

Neutral, primary and status links use an Arco-style background on hover.

DefaultPrimarySuccessWarningDangerInfo

<template>
  <el-link>Default</el-link>
  <el-link type="primary">Primary</el-link>
  <el-link type="success">Success</el-link>
  <el-link type="warning">Warning</el-link>
  <el-link type="danger">Danger</el-link>
  <el-link type="info">Info</el-link>
</template>

Disabled & Icons

Use disabled links for unavailable actions and icon for an Element Plus icon.

DisabledPrimaryEdit

<script setup lang="ts">
import { Edit } from '@element-plus/icons-vue'
</script>

<template>
  <el-link disabled>Disabled</el-link>
  <el-link type="primary" disabled>Primary</el-link>
  <el-link type="primary" :icon="Edit">Edit</el-link>
</template>

Underline

Arco has no underline setting; hover, always and never retain their Element Plus behavior.

HoverAlwaysNever

<template>
  <el-link type="primary" underline="hover">Hover</el-link>
  <el-link type="primary" underline="always">Always</el-link>
  <el-link type="primary" underline="never">Never</el-link>
</template>

Differences from Arco

• The default link is neutral. Use type="primary" for Arco's default color.
• underline follows Element Plus behavior. Set link.underline = 'never' in ConfigProvider to disable it globally.