diff --git a/assets/css/_page/_single.scss b/assets/css/_page/_single.scss
index 6d550cc2..631eaa06 100644
--- a/assets/css/_page/_single.scss
+++ b/assets/css/_page/_single.scss
@@ -273,6 +273,7 @@
     @import "../_partial/_single/mapbox";
     @import "../_partial/_single/music";
     @import "../_partial/_single/bilibili";
+    @import "../_partial/_single/cardlink";
 
     hr {
       margin: 1rem 0;
diff --git a/assets/css/_partial/_single/_cardlink.scss b/assets/css/_partial/_single/_cardlink.scss
new file mode 100644
index 00000000..d516a8e1
--- /dev/null
+++ b/assets/css/_partial/_single/_cardlink.scss
@@ -0,0 +1,97 @@
+//卡片式链接样式 cardlink
+
+.card-link,.card-link:hover {
+  text-decoration: none;
+  border: none!important;
+  color: inherit!important
+}
+
+.card-link {
+  position: relative;
+  display: block;
+  margin: 1em auto;
+  width: 390px;
+  box-sizing: border-box;
+  border-radius: 12px;
+  max-width: 100%;
+  overflow: hidden;
+  color: inherit;
+  text-decoration: none
+}
+
+.ztext {
+  word-break: break-word;
+  line-height: 1.6
+}
+
+.card-link-backdrop {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-image: url(/lib/img/card-link-bg.jpg);
+  background-repeat: no-repeat;
+  -webkit-filter: blur(20px);
+  filter: blur(20px);
+  background-size: cover;
+  background-position: center
+}
+
+.card-link,.card-link:hover {
+  text-decoration: none;
+  border: none!important;
+  color: inherit!important
+}
+
+.card-link-content {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 12px;
+  border-radius: inherit;
+  background-color: rgba(246,246,246,0.88)
+}
+
+.card-link-text {
+  overflow: hidden
+}
+
+.card-link-title {
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-height: calc(16px * 1.25 * 2);
+  font-size: 16px;
+  font-weight: 500;
+  line-height: 1.25;
+  color: #1a1a1a
+}
+
+.card-link-meta {
+  display: flex;
+  margin-top: 4px;
+  font-size: 14px;
+  line-height: 20px;
+  color: #999;
+  white-space: nowrap
+}
+
+.card-link-url {
+  display: inline-flex;
+  align-items: center;
+}
+
+.card-link-imageCell {
+  margin-left: 8px;
+  border-radius: 6px
+}
+
+.card-link-image {
+  display: block;
+  width: 60px;
+  height: 60px;
+  border-radius: inherit
+}
\ No newline at end of file
diff --git a/layouts/partials/plugin/cardlink.html b/layouts/partials/plugin/cardlink.html
new file mode 100644
index 00000000..2fa65d1b
--- /dev/null
+++ b/layouts/partials/plugin/cardlink.html
@@ -0,0 +1,24 @@
+{{- $rel := "" -}}
+<a href="{{ .Destination | safeURL }}"{{ with .Title }} title="{{ . }}"{{ end }}{{ if (urls.Parse .Destination).Host | or .Newtab }}{{ $rel = "noopener noreffer" }} target="_blank"{{ end }} rel="{{ $rel }}{{ with .Rel }} {{ . }}{{ end }}"{{ with .Class }} class="{{ . }} card-link"{{ end }}  class="card-link">
+  <span class="card-link-backdrop"></span>
+  <span class="card-link-content">
+    <span class="card-link-text">
+      <span class="card-link-title">
+          {{- with .Content -}}
+              {{- . | safeHTML -}}
+          {{- end -}}
+      </span>
+      <span class="card-link-meta">
+          <span class="card-link-url">
+              <svg class="Zi Zi--InsertLink" fill="currentColor" viewbox="0 0 24 24" width="17" height="17">
+                  <path d="M6.77 17.23c-.905-.904-.94-2.333-.08-3.193l3.059-3.06-1.192-1.19-3.059 3.058c-1.489 1.489-1.427 3.954.138 5.519s4.03 1.627 5.519.138l3.059-3.059-1.192-1.192-3.059 3.06c-.86.86-2.289.824-3.193-.08zm3.016-8.673l1.192 1.192 3.059-3.06c.86-.86 2.289-.824 3.193.08.905.905.94 2.334.08 3.194l-3.059 3.06 1.192 1.19 3.059-3.058c1.489-1.489 1.427-3.954-.138-5.519s-4.03-1.627-5.519-.138L9.786 8.557zm-1.023 6.68c.33.33.863.343 1.177.029l5.34-5.34c.314-.314.3-.846-.03-1.176-.33-.33-.862-.344-1.176-.03l-5.34 5.34c-.314.314-.3.846.03 1.177z" fill-rule="evenodd"></path>
+              </svg>
+          </span>
+          {{ .Destination | safeURL }}
+      </span>
+    </span>
+    <span class="card-link-imageCell">
+      <img class="card-link-image" alt="card-link icon" src="/lib/img/linkicon.png" />
+    </span>
+  </span>
+</a>
\ No newline at end of file
diff --git a/layouts/shortcodes/cardlink.html b/layouts/shortcodes/cardlink.html
new file mode 100644
index 00000000..96dc4327
--- /dev/null
+++ b/layouts/shortcodes/cardlink.html
@@ -0,0 +1,15 @@
+{{- $destination := cond .IsNamedParams (.Get "href") (.Get 0) -}}
+{{- with dict "Path" $destination "Resources" .Page.Resources | partial "function/resource.html" -}}
+    {{- $destination = .RelPermalink -}}
+{{- end -}}
+{{- $options := dict "Destination" $destination -}}
+{{- if .IsNamedParams -}}
+    {{- $options = dict "Content" (.Get "content") | merge $options -}}
+    {{- $options = dict "Title" (.Get "title") | merge $options -}}
+    {{- $options = dict "Class" (.Get "class") | merge $options -}}
+    {{- $options = dict "Rel" (.Get "rel") | merge $options -}}
+{{- else -}}
+    {{- $options = dict "Content" (.Get 1 | default (.Get 0)) | merge $options -}}
+    {{- $options = dict "Title" (.Get 2) | merge $options -}}
+{{- end -}}
+{{- partial "plugin/cardlink.html" $options -}}
diff --git a/static/lib/img/card-link-bg.jpg b/static/lib/img/card-link-bg.jpg
new file mode 100644
index 00000000..e34661ac
Binary files /dev/null and b/static/lib/img/card-link-bg.jpg differ
diff --git a/static/lib/img/linkicon.png b/static/lib/img/linkicon.png
new file mode 100644
index 00000000..8f68aa5e
Binary files /dev/null and b/static/lib/img/linkicon.png differ