✨ feat: merge pr icon (#321)

* ✨ feat: add Kiro icon (#304) * feat: add Kiro icon * modify primary color from the official kiro.dev/icon.svg color * ✨ feat: add Devin icon (#306) * ✨ feat: add WorldRouter icon (#308) * add WorldRouter icon * format toc.json * ✨ feat: update Yuanbao icon (#305) * ✨ feat: add EvoLinkAI icon (#317) * ✨ feat: Add new icons * ✨ feat: Add AirJelly, Moxt, OpenHuman, Slock and update MetaAI, PixVerse --------- Co-authored-by: changday <[email protected]> Co-authored-by: EvolinkAI <[email protected]>
2026-09-24 16:59:52 +00:00 · 2026-05-28 16:05:27 +08:00
parent d73957c6ac
commit 272f6dfb86
139 changed files with 3579 additions and 194 deletions
@@ -0,0 +1,22 @@
+import React, { memo } from 'react';
+
+import { RNIconAvatar, type RNIconAvatarProps } from '@/features';
+
+import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
+import Mono from './Mono';
+
+export type AvatarProps = Omit<RNIconAvatarProps, 'Icon'>;
+
+const Avatar = memo<AvatarProps>(({ background, ...rest }) => {
+  return (
+    <RNIconAvatar
+      Icon={Mono}
+      aria-label={TITLE}
+      background={background || AVATAR_BACKGROUND}
+      color={AVATAR_COLOR}
+      iconMultiple={AVATAR_ICON_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+export default Avatar;
@@ -0,0 +1,19 @@
+import React, { memo } from 'react';
+import { Path, Svg } from 'react-native-svg';
+
+import type { RNIconProps } from '@/features';
+
+const Icon = memo<RNIconProps>(({ size = 24, style, ...rest }) => {
+  return (
+    <Svg height={size} style={style} viewBox="0 0 24 24" width={size} {...rest}>
+      <Path
+        d="M16.962 13.071c1.667-.022 2.832 8.685 1.297 9.21-1.992.68-1.278-7.563-1.275-7.6 0 0-3.58 9.553-6.135 8.909-2.46-.62 4.445-10.495 6.113-10.519zM3.5 20.471C1.246 17.29 12.668 9.25 16.83 9.812c4.162.563 6.387 8.328 4.83 8.91-1.556.58-2.597-6.608-4.83-6.608-2.354 0-11.076 11.54-13.33 8.357zM1.747 7.711c3.402-5.183 12.01-8.536 17.276-5.183 5.266 3.354 5.529 10.13 4.74 11.087-.87 1.057-1.637-.882-3.666-3.173-4.411-4.977-11.94 1.396-15.9 3.505-2.481 1.322-6.33-.323-2.45-6.235z"
+        fill="#00C8FF"
+      />
+    </Svg>
+  );
+});
+
+Icon.displayName = 'AirJellyColor';
+
+export default Icon;
@@ -0,0 +1,28 @@
+import React, { memo } from 'react';
+
+import { RNIconCombine, type RNIconCombineProps } from '@/features';
+
+import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
+import Color from './Color';
+import Mono from './Mono';
+import Text from './Text';
+
+export interface CombineProps extends Omit<RNIconCombineProps, 'Icon' | 'Text'> {
+  type?: 'color' | 'mono';
+}
+const Combine = memo<CombineProps>(({ type = 'mono', ...rest }) => {
+  const Icon = type === 'color' ? Color : Mono;
+
+  return (
+    <RNIconCombine
+      Icon={Icon}
+      Text={Text}
+      aria-label={TITLE}
+      spaceMultiple={COMBINE_SPACE_MULTIPLE}
+      textMultiple={COMBINE_TEXT_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Combine;
@@ -0,0 +1,27 @@
+import React, { memo } from 'react';
+import { Path, Svg } from 'react-native-svg';
+
+import type { RNIconProps } from '@/features';
+
+const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
+  return (
+    <Svg
+      color={color}
+      fillRule="evenodd"
+      height={size}
+      style={style}
+      viewBox="0 0 24 24"
+      width={size}
+      {...rest}
+    >
+      <Path
+        d="M16.962 13.071c1.667-.022 2.832 8.685 1.297 9.21-1.992.68-1.278-7.563-1.275-7.6 0 0-3.58 9.553-6.135 8.909-2.46-.62 4.445-10.495 6.113-10.519zM3.5 20.471C1.246 17.29 12.668 9.25 16.83 9.812c4.162.563 6.387 8.328 4.83 8.91-1.556.58-2.597-6.608-4.83-6.608-2.354 0-11.076 11.54-13.33 8.357zM1.747 7.711c3.402-5.183 12.01-8.536 17.276-5.183 5.266 3.354 5.529 10.13 4.74 11.087-.87 1.057-1.637-.882-3.666-3.173-4.411-4.977-11.94 1.396-15.9 3.505-2.481 1.322-6.33-.323-2.45-6.235z"
+        fill={color}
+      />
+    </Svg>
+  );
+});
+
+Icon.displayName = 'AirJellyMono';
+
+export default Icon;
@@ -0,0 +1,27 @@
+import React, { memo } from 'react';
+import { Path, Svg } from 'react-native-svg';
+
+import type { RNIconProps } from '@/features';
+
+const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
+  return (
+    <Svg
+      color={color}
+      fillRule="evenodd"
+      height={size}
+      style={style}
+      viewBox="0 0 81 24"
+      width={size * 3.38} // 保持宽高比
+      {...rest}
+    >
+      <Path
+        d="M72.394 8.772c.225 0 .338.12.338.36 0 .298-.254.545-.763.743l-.933.36 2.354 5.727c.056.127.092.297.106.509.014.198.022.325.022.381h.105c0-.07.007-.205.021-.403.029-.198.071-.36.127-.487l2.44-5.748h-1.146c-.325 0-.487-.198-.487-.594 0-.283.1-.494.297-.636.198-.141.466-.212.806-.212h3.605c.226 0 .34.12.34.36 0 .156-.072.29-.213.403-.127.113-.31.227-.55.34l-.828.36-3.987 9.354c-.608 1.414-1.266 2.502-1.973 3.266-.693.763-1.527 1.145-2.503 1.145-.396 0-.728-.114-.997-.34-.268-.212-.402-.502-.402-.869 0-.297.084-.573.254-.827.933 0 1.668-.148 2.206-.445.551-.283 1.011-.835 1.379-1.655l.275-.678-3.817-8.972h-.807c-.325 0-.487-.198-.487-.594 0-.283.099-.494.297-.636.198-.141.466-.212.805-.212h4.116zM41.245 4.445c.24 0 .36.121.36.362a.635.635 0 01-.19.465c-.128.128-.332.249-.615.362l-.892.339v7.847c0 1.357-.268 2.453-.806 3.287-.523.835-1.18 1.47-1.972 1.909-.58.31-1.16.466-1.74.466-.423 0-.77-.14-1.038-.423-.27-.283-.417-.736-.446-1.358.806-.283 1.45-.587 1.93-.912.48-.325.834-.736 1.06-1.23.24-.51.362-1.145.362-1.909V5.973H35.9a.509.509 0 01-.403-.17c-.085-.113-.127-.27-.127-.467 0-.297.106-.516.318-.657.212-.156.495-.234.848-.234h4.71zm7.076 4.115c.933 0 1.753.184 2.46.551.721.368 1.28.891 1.676 1.57.41.678.615 1.47.615 2.375 0 .254-.036.537-.106.848a3.16 3.16 0 01-.276.784h-7.062c0 1.075.297 1.888.89 2.44.608.551 1.337.827 2.185.827.495 0 .926-.057 1.294-.17a7.109 7.109 0 001.273-.594c.056-.028.148-.077.275-.148.141-.085.255-.127.34-.127.183 0 .338.07.466.212a.764.764 0 01.191.53.816.816 0 01-.191.53c-.128.156-.332.318-.615.488-.933.537-1.987.806-3.16.806-1.033 0-1.966-.205-2.8-.615a4.666 4.666 0 01-1.952-1.824c-.466-.806-.699-1.782-.699-2.927 0-1.16.219-2.156.657-2.99.453-.834 1.068-1.47 1.846-1.91.792-.437 1.69-.656 2.693-.656zm-33.068 9.098l.806.277c.282.099.488.211.615.338a.568.568 0 01.191.446c0 .31-.106.466-.318.466h-5.303c-.34 0-.509-.211-.509-.635 0-.297.107-.517.319-.658.212-.156.494-.234.847-.234h.68l-1.082-2.905H5.581l-1.06 2.905 1.167.361c.324.1.551.205.678.318.127.113.19.262.19.446 0 .268-.106.402-.318.402H1.53a.509.509 0 01-.403-.17C1.042 18.904 1 18.748 1 18.55c0-.297.106-.517.318-.658.212-.156.496-.234.849-.234h.36l4.92-13.213h2.885l4.92 13.213zm6.342.086l.848.339c.283.127.481.247.594.36a.484.484 0 01.17.382c0 .24-.107.36-.318.36h-4.751c-.326 0-.489-.197-.489-.593 0-.566.375-.848 1.124-.848h.34v-7.53h-.975c-.325 0-.489-.197-.489-.593 0-.283.1-.495.297-.637.198-.141.474-.212.827-.212h2.822v8.972zm36.749 0l.848.339c.283.127.481.247.594.36a.484.484 0 01.17.382c-.001.24-.107.36-.318.36h-4.752c-.325 0-.488-.197-.488-.593 0-.566.375-.849 1.124-.849h.34V5.57h-.976c-.325 0-.488-.198-.488-.593 0-.283.1-.495.297-.636.198-.142.474-.213.828-.213h2.82v13.616zm6.98 0l.848.339c.282.127.48.247.594.36.113.1.17.227.17.382 0 .24-.107.36-.319.36h-4.75c-.326 0-.489-.197-.49-.593 0-.566.377-.849 1.126-.849h.339V5.57h-.976c-.325 0-.488-.198-.488-.593 0-.283.1-.495.297-.636.198-.142.474-.213.828-.213h2.82v13.616zM31.85 8.56c.41 0 .727.112.954.338.226.227.339.517.339.87 0 .212-.043.424-.127.636-.071.198-.17.361-.297.489-1.626 0-3.104.537-4.433 1.61v5.24l.849.339c.282.127.48.247.594.36a.484.484 0 01.168.382c0 .24-.105.36-.317.36h-4.75c-.326 0-.49-.197-.49-.593.001-.565.376-.848 1.125-.848h.34v-7.53h-.976c-.325 0-.488-.197-.488-.593 0-.283.099-.495.297-.637.198-.141.474-.211.827-.212h2.715v2.143h.063a7.8 7.8 0 011.74-1.676c.65-.452 1.273-.678 1.867-.678zM48.3 10.087c-.735 0-1.35.276-1.845.827-.495.552-.77 1.3-.827 2.248h4.856c.071-.184.107-.396.107-.637 0-.763-.206-1.357-.615-1.78-.41-.44-.97-.658-1.676-.658zm-42.104 2.97h4.666L8.551 6.673l-2.355 6.384zM20.301 4c.466 0 .855.15 1.166.446.325.297.488.693.488 1.188s-.163.89-.488 1.187c-.311.297-.7.446-1.166.446-.467 0-.856-.149-1.167-.446-.311-.297-.466-.693-.466-1.187 0-.495.155-.89.466-1.188.31-.297.7-.446 1.167-.446z"
+        fill={color}
+      />
+    </Svg>
+  );
+});
+
+Icon.displayName = 'AirJellyText';
+
+export default Icon;
@@ -0,0 +1,25 @@
+import Avatar from './components/Avatar';
+import Color from './components/Color';
+import Combine from './components/Combine';
+import Mono from './components/Mono';
+import Text from './components/Text';
+import { COLOR_PRIMARY, TITLE } from './style';
+
+export type CompoundedIcon = typeof Mono & {
+  Avatar: typeof Avatar;
+  Color: typeof Color;
+  Combine: typeof Combine;
+  Text: typeof Text;
+  colorPrimary: string;
+  title: string;
+};
+
+const Icons = Mono as CompoundedIcon;
+Icons.Color = Color;
+Icons.Text = Text;
+Icons.Combine = Combine;
+Icons.Avatar = Avatar;
+Icons.colorPrimary = COLOR_PRIMARY;
+Icons.title = TITLE;
+
+export default Icons;
@@ -0,0 +1,9 @@
+export const TITLE = 'AirJelly';
+export const COMBINE_TEXT_MULTIPLE = 0.85;
+export const COMBINE_SPACE_MULTIPLE = 0.2;
+export const COLOR_PRIMARY = '#00C8FF';
+
+// Avatar constants
+export const AVATAR_BACKGROUND = COLOR_PRIMARY;
+export const AVATAR_COLOR = '#fff';
+export const AVATAR_ICON_MULTIPLE = 0.75;
@@ -0,0 +1,22 @@
+import React, { memo } from 'react';
+
+import { RNIconAvatar, type RNIconAvatarProps } from '@/features';
+
+import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
+import Color from './Color';
+
+export type AvatarProps = Omit<RNIconAvatarProps, 'Icon'>;
+
+const Avatar = memo<AvatarProps>(({ background, ...rest }) => {
+  return (
+    <RNIconAvatar
+      Icon={Color}
+      aria-label={TITLE}
+      background={background || AVATAR_BACKGROUND}
+      color={AVATAR_COLOR}
+      iconMultiple={AVATAR_ICON_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+export default Avatar;
@@ -0,0 +1,27 @@
+import React, { memo } from 'react';
+import { Path, Svg } from 'react-native-svg';
+
+import type { RNIconProps } from '@/features';
+
+const Icon = memo<RNIconProps>(({ size = 24, style, ...rest }) => {
+  return (
+    <Svg height={size} style={style} viewBox="0 0 24 24" width={size} {...rest}>
+      <Path
+        d="M2.033 9.867l2.554 1.483a.589.589 0 00.592 0l2.554-1.483.01-.008a.608.608 0 00.11-.084l.013-.015a.631.631 0 00.076-.1c.003-.005.008-.01.01-.016a.558.558 0 00.052-.125l.007-.028a.611.611 0 00.019-.14V7.868c0-.572.307-1.105.8-1.392a1.595 1.595 0 011.598 0l1.277.742a.54.54 0 00.129.053l.028.01c.044.01.088.015.133.016h.006l.013-.002a.587.587 0 00.27-.074l.011-.004 2.554-1.483a.596.596 0 00.297-.516V2.253a.595.595 0 00-.297-.516L12.293.257a.587.587 0 00-.591 0L9.148 1.737l-.01.01a.609.609 0 00-.109.083l-.014.015a.632.632 0 00-.076.1c-.003.005-.008.01-.01.016a.57.57 0 00-.052.124l-.007.028a.612.612 0 00-.018.14v1.483c0 .572-.307 1.105-.8 1.393a1.597 1.597 0 01-1.599 0l-1.276-.742a.603.603 0 00-.13-.053l-.028-.008a.658.658 0 00-.133-.018h-.02a.57.57 0 00-.269.074c-.003.002-.008.002-.012.005L2.033 5.872a.596.596 0 00-.297.515v2.966c0 .213.113.41.297.515z"
+        fill="#3969CA"
+      />
+      <Path
+        d="M15.943 10.607a1.596 1.596 0 011.599 0l1.276.74c.041.025.085.04.13.055l.028.008c.043.01.088.016.133.018h.005c.005 0 .01-.002.014-.003a.474.474 0 00.122-.016l.021-.005a.616.616 0 00.126-.052c.004-.002.009-.002.013-.005l2.554-1.482a.597.597 0 00.297-.516V6.383a.596.596 0 00-.297-.515l-2.552-1.483a.587.587 0 00-.592 0l-2.553 1.482-.011.008a.61.61 0 00-.108.084l-.014.016a.637.637 0 00-.076.1c-.003.005-.008.01-.01.016a.57.57 0 00-.052.124l-.007.029a.612.612 0 00-.018.14v1.482c0 .572-.307 1.105-.8 1.393a1.597 1.597 0 01-1.599 0l-1.276-.742a.584.584 0 00-.13-.053l-.028-.008a.62.62 0 00-.133-.018h-.02a.587.587 0 00-.269.074l-.012.004L9.15 10a.596.596 0 00-.296.516v2.966c0 .212.112.409.296.515l2.554 1.483s.008.002.012.005c.04.022.082.04.126.052l.02.004a.57.57 0 00.123.017l.014.002h.006c.054 0 .108-.01.16-.025a.587.587 0 00.13-.054l1.277-.741a1.597 1.597 0 012.398 1.392v1.482c0 .049.007.095.019.14l.007.028a.619.619 0 00.051.125c.004.006.008.01.01.016a.6.6 0 00.076.1l.014.015c.033.032.069.06.108.084.004.002.006.006.011.008l2.554 1.483a.59.59 0 00.593 0l2.554-1.483a.597.597 0 00.296-.516v-2.965a.595.595 0 00-.296-.516l-2.554-1.483s-.008-.002-.012-.005a.54.54 0 00-.126-.051c-.007-.003-.013-.003-.02-.005a.635.635 0 00-.125-.017h-.018a.557.557 0 00-.16.026.588.588 0 00-.13.053l-1.276.742a1.595 1.595 0 01-1.598 0 1.615 1.615 0 010-2.785l-.005-.001z"
+        fill="#21C19A"
+      />
+      <Path
+        d="M14.848 18.265l-2.554-1.482-.012-.005a.526.526 0 00-.126-.052c-.007-.002-.014-.002-.02-.005a.64.64 0 00-.124-.017h-.02a.56.56 0 00-.16.026.588.588 0 00-.13.053l-1.276.742a1.594 1.594 0 01-1.598 0c-.493-.286-.8-.82-.8-1.393V14.65a.563.563 0 00-.018-.14l-.008-.028a.604.604 0 00-.051-.124l-.01-.017a.603.603 0 00-.076-.1l-.014-.015a.596.596 0 00-.109-.084c-.003-.002-.005-.006-.01-.008L5.178 12.65a.587.587 0 00-.591 0l-2.554 1.483a.596.596 0 00-.297.516v2.965c0 .213.113.41.297.516l2.554 1.483.012.004a.618.618 0 00.267.074l.016.002h.007a.55.55 0 00.16-.026.584.584 0 00.129-.053l1.277-.742a1.597 1.597 0 012.398 1.393v1.482c0 .05.007.095.019.14l.007.028c.013.044.03.085.051.125l.01.016c.022.036.047.07.076.1l.014.015c.032.032.069.06.109.084l.01.008 2.554 1.483a.587.587 0 00.593 0l2.554-1.483a.596.596 0 00.296-.515v-2.966a.596.596 0 00-.296-.516h-.002z"
+        fill="#0294DE"
+      />
+    </Svg>
+  );
+});
+
+Icon.displayName = 'DevinColor';
+
+export default Icon;
@@ -0,0 +1,28 @@
+import React, { memo } from 'react';
+
+import { RNIconCombine, type RNIconCombineProps } from '@/features';
+
+import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
+import Color from './Color';
+import Mono from './Mono';
+import Text from './Text';
+
+export interface CombineProps extends Omit<RNIconCombineProps, 'Icon' | 'Text'> {
+  type?: 'color' | 'mono';
+}
+const Combine = memo<CombineProps>(({ type = 'mono', ...rest }) => {
+  const Icon = type === 'color' ? Color : Mono;
+
+  return (
+    <RNIconCombine
+      Icon={Icon}
+      Text={Text}
+      aria-label={TITLE}
+      spaceMultiple={COMBINE_SPACE_MULTIPLE}
+      textMultiple={COMBINE_TEXT_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Combine;
@@ -0,0 +1,35 @@
+import React, { memo } from 'react';
+import { Path, Svg } from 'react-native-svg';
+
+import type { RNIconProps } from '@/features';
+
+const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
+  return (
+    <Svg
+      color={color}
+      fillRule="evenodd"
+      height={size}
+      style={style}
+      viewBox="0 0 24 24"
+      width={size}
+      {...rest}
+    >
+      <Path
+        d="M2.033 9.867l2.554 1.483a.589.589 0 00.592 0l2.554-1.483.01-.008a.608.608 0 00.11-.084l.013-.015a.631.631 0 00.076-.1c.003-.005.008-.01.01-.016a.558.558 0 00.052-.125l.007-.028a.611.611 0 00.019-.14V7.868c0-.572.307-1.105.8-1.392a1.595 1.595 0 011.598 0l1.277.742a.54.54 0 00.129.053l.028.01c.044.01.088.015.133.016h.006l.013-.002a.587.587 0 00.27-.074l.011-.004 2.554-1.483a.596.596 0 00.297-.516V2.253a.595.595 0 00-.297-.516L12.293.257a.587.587 0 00-.591 0L9.148 1.737l-.01.01a.609.609 0 00-.109.083l-.014.015a.632.632 0 00-.076.1c-.003.005-.008.01-.01.016a.57.57 0 00-.052.124l-.007.028a.612.612 0 00-.018.14v1.483c0 .572-.307 1.105-.8 1.393a1.597 1.597 0 01-1.599 0l-1.276-.742a.603.603 0 00-.13-.053l-.028-.008a.658.658 0 00-.133-.018h-.02a.57.57 0 00-.269.074c-.003.002-.008.002-.012.005L2.033 5.872a.596.596 0 00-.297.515v2.966c0 .213.113.41.297.515z"
+        fill={color}
+      />
+      <Path
+        d="M15.943 10.607a1.596 1.596 0 011.599 0l1.276.74c.041.025.085.04.13.055l.028.008c.043.01.088.016.133.018h.005c.005 0 .01-.002.014-.003a.474.474 0 00.122-.016l.021-.005a.616.616 0 00.126-.052c.004-.002.009-.002.013-.005l2.554-1.482a.597.597 0 00.297-.516V6.383a.596.596 0 00-.297-.515l-2.552-1.483a.587.587 0 00-.592 0l-2.553 1.482-.011.008a.61.61 0 00-.108.084l-.014.016a.637.637 0 00-.076.1c-.003.005-.008.01-.01.016a.57.57 0 00-.052.124l-.007.029a.612.612 0 00-.018.14v1.482c0 .572-.307 1.105-.8 1.393a1.597 1.597 0 01-1.599 0l-1.276-.742a.584.584 0 00-.13-.053l-.028-.008a.62.62 0 00-.133-.018h-.02a.587.587 0 00-.269.074l-.012.004L9.15 10a.596.596 0 00-.296.516v2.966c0 .212.112.409.296.515l2.554 1.483s.008.002.012.005c.04.022.082.04.126.052l.02.004a.57.57 0 00.123.017l.014.002h.006c.054 0 .108-.01.16-.025a.587.587 0 00.13-.054l1.277-.741a1.597 1.597 0 012.398 1.392v1.482c0 .049.007.095.019.14l.007.028a.619.619 0 00.051.125c.004.006.008.01.01.016a.6.6 0 00.076.1l.014.015c.033.032.069.06.108.084.004.002.006.006.011.008l2.554 1.483a.59.59 0 00.593 0l2.554-1.483a.597.597 0 00.296-.516v-2.965a.595.595 0 00-.296-.516l-2.554-1.483s-.008-.002-.012-.005a.54.54 0 00-.126-.051c-.007-.003-.013-.003-.02-.005a.635.635 0 00-.125-.017h-.018a.557.557 0 00-.16.026.588.588 0 00-.13.053l-1.276.742a1.595 1.595 0 01-1.598 0 1.615 1.615 0 010-2.785l-.005-.001z"
+        fill={color}
+      />
+      <Path
+        d="M14.848 18.265l-2.554-1.482-.012-.005a.526.526 0 00-.126-.052c-.007-.002-.014-.002-.02-.005a.64.64 0 00-.124-.017h-.02a.56.56 0 00-.16.026.588.588 0 00-.13.053l-1.276.742a1.594 1.594 0 01-1.598 0c-.493-.286-.8-.82-.8-1.393V14.65a.563.563 0 00-.018-.14l-.008-.028a.604.604 0 00-.051-.124l-.01-.017a.603.603 0 00-.076-.1l-.014-.015a.596.596 0 00-.109-.084c-.003-.002-.005-.006-.01-.008L5.178 12.65a.587.587 0 00-.591 0l-2.554 1.483a.596.596 0 00-.297.516v2.965c0 .213.113.41.297.516l2.554 1.483.012.004a.618.618 0 00.267.074l.016.002h.007a.55.55 0 00.16-.026.584.584 0 00.129-.053l1.277-.742a1.597 1.597 0 012.398 1.393v1.482c0 .05.007.095.019.14l.007.028c.013.044.03.085.051.125l.01.016c.022.036.047.07.076.1l.014.015c.032.032.069.06.109.084l.01.008 2.554 1.483a.587.587 0 00.593 0l2.554-1.483a.596.596 0 00.296-.515v-2.966a.596.596 0 00-.296-.516h-.002z"
+        fill={color}
+      />
+    </Svg>
+  );
+});
+
+Icon.displayName = 'DevinMono';
+
+export default Icon;
@@ -0,0 +1,26 @@
+import React, { memo } from 'react';
+import { Path, Svg } from 'react-native-svg';
+
+import type { RNIconProps } from '@/features';
+
+const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
+  return (
+    <Svg
+      color={color}
+      height={size}
+      style={style}
+      viewBox="0 0 80 24"
+      width={size * 3.33} // 保持宽高比
+      {...rest}
+    >
+      <Path
+        d="M69.069 13.524v10.135h-3.325V6.589h3.191v2.779h.211a4.88 4.88 0 011.846-2.178c.845-.549 1.909-.823 3.191-.823 1.164 0 2.183.245 3.057.734.875.481 1.553 1.2 2.035 2.156.482.955.723 2.137.723 3.545v10.857h-3.325V13.202c0-1.238-.322-2.204-.967-2.9-.645-.705-1.53-1.057-2.657-1.057-.771 0-1.457.167-2.057.5-.593.334-1.064.823-1.412 1.467-.341.638-.511 1.408-.511 2.312zM57.95 23.67V6.602h3.324v17.07H57.95zm1.679-19.703a2.114 2.114 0 01-1.49-.578c-.408-.392-.612-.859-.612-1.4 0-.548.204-1.015.612-1.4A2.092 2.092 0 0159.629 0c.578 0 1.07.196 1.479.589.415.385.622.852.622 1.4 0 .541-.207 1.008-.622 1.4-.408.386-.901.578-1.48.578zM54.824 6.59l-6.193 17.07h-3.558L38.87 6.59h3.57l4.324 13.135h.178L51.255 6.59h3.569zM29.69 24.003c-1.683 0-3.132-.359-4.347-1.078-1.209-.726-2.142-1.744-2.802-3.056-.652-1.318-.979-2.863-.979-4.634 0-1.748.327-3.29.979-4.623.66-1.333 1.579-2.374 2.757-3.122 1.186-.749 2.572-1.123 4.159-1.123.963 0 1.897.16 2.801.478a6.787 6.787 0 012.435 1.5c.72.682 1.286 1.567 1.701 2.656.416 1.082.623 2.397.623 3.945v1.178H23.441v-2.489H33.76c0-.874-.178-1.648-.533-2.323a4.034 4.034 0 00-1.501-1.61c-.638-.394-1.386-.59-2.246-.59-.934 0-1.75.23-2.446.69a4.625 4.625 0 00-1.601 1.777 5.131 5.131 0 00-.556 2.367v1.945c0 1.14.2 2.111.6 2.911.408.8.975 1.412 1.701 1.834.727.415 1.575.623 2.546.623a5.29 5.29 0 001.724-.267c.519-.186.967-.46 1.345-.823.378-.363.667-.81.867-1.344l3.147.567a5.694 5.694 0 01-1.357 2.433c-.645.69-1.456 1.226-2.435 1.612-.97.377-2.079.566-3.324.566zM7.371 23.666H0V.905h7.605c2.231 0 4.147.456 5.748 1.367 1.601.904 2.828 2.204 3.68 3.9.86 1.69 1.29 3.716 1.29 6.08 0 2.37-.434 4.408-1.3 6.112-.86 1.704-2.106 3.015-3.737 3.934-1.63.91-3.602 1.367-5.915 1.367zm-3.935-3.001h3.746c1.735 0 3.177-.326 4.325-.978 1.15-.66 2.01-1.611 2.58-2.856.57-1.252.856-2.778.856-4.579 0-1.785-.285-3.3-.856-4.545-.563-1.244-1.405-2.189-2.524-2.833-1.12-.645-2.509-.967-4.17-.967H3.437v16.758z"
+        fill={color}
+      />
+    </Svg>
+  );
+});
+
+Icon.displayName = 'DevinText';
+
+export default Icon;
@@ -0,0 +1,25 @@
+import Avatar from './components/Avatar';
+import Color from './components/Color';
+import Combine from './components/Combine';
+import Mono from './components/Mono';
+import Text from './components/Text';
+import { COLOR_PRIMARY, TITLE } from './style';
+
+export type CompoundedIcon = typeof Mono & {
+  Avatar: typeof Avatar;
+  Color: typeof Color;
+  Combine: typeof Combine;
+  Text: typeof Text;
+  colorPrimary: string;
+  title: string;
+};
+
+const Icons = Mono as CompoundedIcon;
+Icons.Color = Color;
+Icons.Text = Text;
+Icons.Combine = Combine;
+Icons.Avatar = Avatar;
+Icons.colorPrimary = COLOR_PRIMARY;
+Icons.title = TITLE;
+
+export default Icons;
@@ -0,0 +1,9 @@
+export const TITLE = 'Devin';
+export const COMBINE_TEXT_MULTIPLE = 0.55;
+export const COMBINE_SPACE_MULTIPLE = 0.2;
+export const COLOR_PRIMARY = '#fff';
+
+// Avatar constants
+export const AVATAR_BACKGROUND = COLOR_PRIMARY;
+export const AVATAR_COLOR = '#fff';
+export const AVATAR_ICON_MULTIPLE = 0.65;
@@ -0,0 +1,22 @@
+import React, { memo } from 'react';
+
+import { RNIconAvatar, type RNIconAvatarProps } from '@/features';
+
+import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
+import Color from './Color';
+
+export type AvatarProps = Omit<RNIconAvatarProps, 'Icon'>;
+
+const Avatar = memo<AvatarProps>(({ background, ...rest }) => {
+  return (
+    <RNIconAvatar
+      Icon={Color}
+      aria-label={TITLE}
+      background={background || AVATAR_BACKGROUND}
+      color={AVATAR_COLOR}
+      iconMultiple={AVATAR_ICON_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+export default Avatar;
@@ -0,0 +1,27 @@
+import React, { memo } from 'react';
+import { Path, Svg } from 'react-native-svg';
+
+import type { RNIconProps } from '@/features';
+
+const Icon = memo<RNIconProps>(({ size = 24, style, ...rest }) => {
+  return (
+    <Svg height={size} style={style} viewBox="0 0 24 24" width={size} {...rest}>
+      <Path
+        d="M18.8 0H5.2A5.2 5.2 0 000 5.2v13.6A5.2 5.2 0 005.2 24h13.6a5.2 5.2 0 005.2-5.2V5.2A5.2 5.2 0 0018.8 0z"
+        fill="#9046FF"
+      />
+      <Path
+        d="M7.97 16.376c-1.644 3.642 1.86 4.556 4.443 2.424.76 2.39 3.608.607 4.631-1.247 2.251-4.084 1.342-8.249 1.108-9.108-1.6-5.859-9.6-5.869-10.976.03-.323 1.033-.328 2.206-.507 3.423-.09.617-.16 1.009-.393 1.655-.139.373-.323.7-.62 1.257-.458.865-.264 2.53 2.101 1.665l.224-.1h-.01l-.001.001z"
+        fill="#fff"
+      />
+      <Path
+        d="M12.722 10.985c-.656 0-.755-.785-.755-1.252 0-.423.074-.756.218-.97a.61.61 0 01.537-.283c.229 0 .428.095.567.289.159.218.243.55.243.964 0 .785-.303 1.252-.805 1.252h-.005zm2.703 0c-.656 0-.755-.785-.755-1.252 0-.423.074-.756.219-.97a.61.61 0 01.536-.283c.229 0 .428.095.567.289.159.218.243.55.243.964 0 .785-.303 1.252-.805 1.252h-.005z"
+        fill="#000"
+      />
+    </Svg>
+  );
+});
+
+Icon.displayName = 'KiroColor';
+
+export default Icon;
@@ -0,0 +1,28 @@
+import React, { memo } from 'react';
+
+import { RNIconCombine, type RNIconCombineProps } from '@/features';
+
+import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
+import Color from './Color';
+import Mono from './Mono';
+import Text from './Text';
+
+export interface CombineProps extends Omit<RNIconCombineProps, 'Icon' | 'Text'> {
+  type?: 'color' | 'mono';
+}
+const Combine = memo<CombineProps>(({ type = 'mono', ...rest }) => {
+  const Icon = type === 'color' ? Color : Mono;
+
+  return (
+    <RNIconCombine
+      Icon={Icon}
+      Text={Text}
+      aria-label={TITLE}
+      spaceMultiple={COMBINE_SPACE_MULTIPLE}
+      textMultiple={COMBINE_TEXT_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Combine;
@@ -0,0 +1,27 @@
+import React, { memo } from 'react';
+import { Path, Svg } from 'react-native-svg';
+
+import type { RNIconProps } from '@/features';
+
+const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
+  return (
+    <Svg
+      color={color}
+      fillRule="evenodd"
+      height={size}
+      style={style}
+      viewBox="0 0 24 24"
+      width={size}
+      {...rest}
+    >
+      <Path
+        d="M4.594 6.677C6.67-2.226 18.746-2.211 21.16 6.632c.353 1.297 1.725 7.582-1.673 13.747-1.545 2.797-5.841 5.49-6.99 1.883C8.6 25.477 3.315 24.1 5.789 18.609l-.318.143c-3.57 1.305-3.863-1.208-3.173-2.513.45-.84.727-1.335.937-1.897.353-.975.458-1.568.593-2.498.27-1.837.277-3.607.765-5.167zm8.37.01a.92.92 0 00-.81.428c-.217.323-.33.825-.33 1.462 0 .705.15 1.89 1.14 1.89h.008c.757 0 1.214-.705 1.214-1.89 0-.622-.127-1.125-.367-1.455a1.014 1.014 0 00-.855-.435zm4.08 0a.92.92 0 00-.81.428c-.217.323-.33.825-.33 1.462 0 .705.15 1.89 1.14 1.89h.008c.757 0 1.215-.705 1.215-1.89 0-.622-.128-1.125-.368-1.455a1.014 1.014 0 00-.855-.435z"
+        fill={color}
+      />
+    </Svg>
+  );
+});
+
+Icon.displayName = 'KiroMono';
+
+export default Icon;
@@ -0,0 +1,35 @@
+import React, { memo } from 'react';
+import { Path, Svg } from 'react-native-svg';
+
+import type { RNIconProps } from '@/features';
+
+const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
+  return (
+    <Svg
+      color={color}
+      fillRule="evenodd"
+      height={size}
+      style={style}
+      viewBox="0 0 75 24"
+      width={size * 3.13} // 保持宽高比
+      {...rest}
+    >
+      <Path
+        d="M63.109.102l.084-.012c2.376-.3 5.556.652 7.412 2.153 2.46 1.983 3.742 4.752 4.095 7.854.78 6.871-2.372 13.009-9.693 13.833l-.049.005c-6.372.67-10.97-3.98-11.478-10.145C52.913 6.908 55.667.861 63.11.102zm1.767 22.56c1.751-.214 3.362-.669 4.79-1.757 5.126-3.907 5.176-13.678.11-17.656-1.836-1.442-4.11-1.973-6.402-1.864-2.489.28-4.882 1.088-6.44 3.16-3.276 4.363-3.105 12.814 1.397 16.353 1.946 1.53 4.173 1.915 6.545 1.765z"
+        fill={color}
+      />
+      <Path
+        d="M63.327 5.65c2.534-.288 4.397 1.158 4.989 3.596.793 3.266.466 8.185-3.509 9.143-2.821.26-4.484-1.172-5.012-3.91-.6-3.108-.355-8.06 3.532-8.83zm1 11.515c2.991-.497 3.331-4.425 2.89-6.823-.371-2.017-1.139-3.365-3.362-3.463-3.15.408-3.191 4.428-2.878 6.839.26 2 1.147 3.518 3.35 3.447zM41.137.05c3.343-.013 7.226.095 9.45 3.044 1.911 2.535 1.986 6.818.122 9.401-.487.674-1.093 1.178-1.75 1.678 1.36 1.96 3.58 4.447 2.914 6.94a3.944 3.944 0 01-1.839 2.382c-1.3.741-3.127.648-4.295-.27-1.227-.963-2.095-2.884-2.867-4.245l-1.899-3.322-.84.002c.004 1.676.133 3.819-.183 5.437-.573 2.936-4.525 3.77-6.583 1.837-.942-.886-1.102-2.571-1.116-3.807.013-4.857-.025-9.716.005-14.572.02-1.192.334-2.87 1.348-3.625C35.32-.346 39.025.068 41.137.05zm-2.291 14.356c.96-.003 1.948-.018 2.906-.007a552.359 552.359 0 013.027 5.287c.781 1.412 1.51 3.173 3.447 3.024a2.784 2.784 0 001.192-.347 2.506 2.506 0 001.197-1.53c.26-.934-.014-1.828-.494-2.636-.901-1.516-2.094-2.974-2.997-4.48.917-.503 1.771-.96 2.418-1.818 1.243-1.652 1.487-4.146.95-6.107-1.455-5.299-8.269-4.437-12.515-4.46-1.99.002-4.014-.183-4.37 2.382-.146 1.047-.086 2.073-.087 3.127.026 4.003.017 8.01 0 12.013.034.964.065 2.484.834 3.183 1.39 1.262 3.952.746 4.344-1.258.23-1.177.16-2.279.162-3.476.003-.957-.024-1.934-.014-2.897z"
+        fill={color}
+      />
+      <Path
+        d="M38.894 5.484c1.966-.017 6.305-.66 6.431 2.072.043.926-.026 1.335-.631 2.038-1.283.947-4.193.7-5.833.686-.005-.687-.07-4.344.033-4.796zm1.252 3.509c1.002.015 2.786.136 3.65-.308 1.494-2.37-2.398-1.93-3.647-1.926l-.003 2.234zM25.483.098c.933-.117 1.983.093 2.781.59 2.111 1.315 1.755 4.198 1.746 6.355l-.012 5.469.011 4.32c.028 3.174.506 6.293-3.399 7.109-.98.108-2.148-.087-2.963-.66-1.837-1.293-1.596-3.846-1.601-5.842l-.008-4.852-.007-5.141C22.024 4.356 21.53.73 25.483.098zm1.019 22.567c1.769-.412 2.085-1.246 2.2-2.948.064-.932.034-1.877.034-2.81V12.22l.001-5.088c0-2.533.544-6.006-3.093-5.75-2.793.608-2.308 3.13-2.295 5.398l.008 4.334-.003 5.695c-.003 2.512-.58 6.232 3.148 5.856zM3.382.095A7.48 7.48 0 014 .07C8.106.11 7.925 4.077 7.86 7.01c.248-.212.524-.517.758-.755 1.497-1.523 2.961-3.079 4.466-4.594C14.027.71 14.96.055 16.36.074A3.68 3.68 0 0118.981 1.2c.632.668.967 1.563.93 2.482-.066 1.95-1.744 3.27-3.057 4.511l-2.357 2.225c1.716 2.314 3.454 4.849 5.052 7.255 1.035 1.558.951 3.282-.081 4.865-.257.314-.56.587-.9.809-1.494.97-3.767.863-5.027-.442-.891-.924-1.427-2.04-2.07-3.135-.805-1.374-1.559-2.785-2.404-4.132l-1.198 1.147c.085 2.68.387 6.41-3.053 7.107-2.222.45-4.244-.683-4.618-2.994-.215-1.324-.157-2.589-.154-3.927l.004-4.966-.006-4.416C.015 4.506-.544.772 3.382.095zm3.207 16.157c.903-.904 1.823-1.79 2.76-2.66 1.059 1.662 1.99 3.433 3.007 5.12.623 1.032 1.207 2.363 2.032 3.226 1.374 1.437 3.903.825 4.506-1.078.08-.512.163-1.156-.033-1.646-.423-1.056-1.297-2.202-1.955-3.139l-2.582-3.669c-.463-.66-1.08-1.49-1.493-2.16l2.816-2.687c.854-.81 1.963-1.72 2.585-2.7 1.402-2.207-1.15-4.468-3.27-3.106-.818.525-1.446 1.387-2.159 2.04C11.192 5.34 9.677 7.126 8.04 8.628l-1.45.012c-.02-2.455.836-7.311-2.71-7.28a3.28 3.28 0 00-.339.02c-1.709.427-2.089 1.268-2.221 2.943-.066.827-.024 1.68-.018 2.509l.01 3.835-.003 5.548c-.002 1.635-.124 3.223.238 4.825.463 2.045 3.643 2.27 4.536.549.748-1.441.54-3.73.507-5.337z"
+        fill={color}
+      />
+    </Svg>
+  );
+});
+
+Icon.displayName = 'KiroText';
+
+export default Icon;
@@ -0,0 +1,25 @@
+import Avatar from './components/Avatar';
+import Color from './components/Color';
+import Combine from './components/Combine';
+import Mono from './components/Mono';
+import Text from './components/Text';
+import { COLOR_PRIMARY, TITLE } from './style';
+
+export type CompoundedIcon = typeof Mono & {
+  Avatar: typeof Avatar;
+  Color: typeof Color;
+  Combine: typeof Combine;
+  Text: typeof Text;
+  colorPrimary: string;
+  title: string;
+};
+
+const Icons = Mono as CompoundedIcon;
+Icons.Color = Color;
+Icons.Text = Text;
+Icons.Combine = Combine;
+Icons.Avatar = Avatar;
+Icons.colorPrimary = COLOR_PRIMARY;
+Icons.title = TITLE;
+
+export default Icons;
@@ -0,0 +1,9 @@
+export const TITLE = 'Kiro';
+export const COMBINE_TEXT_MULTIPLE = 0.7;
+export const COMBINE_SPACE_MULTIPLE = 0.25;
+export const COLOR_PRIMARY = '#9046ff';
+
+// Avatar constants
+export const AVATAR_BACKGROUND = COLOR_PRIMARY;
+export const AVATAR_COLOR = '#fff';
+export const AVATAR_ICON_MULTIPLE = 1;
@@ -1,5 +1,5 @@
 import React, { memo } from 'react';
-import { ClipPath, Defs, G, LinearGradient, Path, Stop, Svg } from 'react-native-svg';
+import { Defs, LinearGradient, Path, Stop, Svg } from 'react-native-svg';

 import type { RNIconProps } from '@/features';
 import { useFillIds } from '@/hooks/useFillId';
@@ -7,29 +7,89 @@ import { useFillIds } from '@/hooks/useFillId';
 import { TITLE } from '../style';

 const Icon = memo<RNIconProps>(({ size = 24, style, ...rest }) => {
-  const [a, , c] = useFillIds(TITLE, 3);
+  const [a, b, c, d, e, f, g] = useFillIds(TITLE, 7);
  return (
    <Svg height={size} style={style} viewBox="0 0 24 24" width={size} {...rest}>
-      <G clipPath={a.fill}>
-        <Path
-          clipRule="evenodd"
-          d="M12 0c6.627 0 12 5.373 12 12s-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0zm0 3.627a8.373 8.373 0 100 16.746 8.373 8.373 0 000-16.746z"
-          fill={c.fill}
-          fillRule="evenodd"
-        />
-      </G>
+      <Path
+        d="M10.547.232c.776-.086 1.543.244 2.152.712.784.598 1.375 1.434 1.757 2.347.19.444.3.92.345 1.402.01.384.024.781-.108 1.148-.126.406-.362.795-.728 1.017-.352.236-.786.3-1.199.288-.84-.073-1.613-.52-2.212-1.106-.15-.1-.236-.263-.368-.38-.801-.97-1.394-2.203-1.324-3.496.048-.698.38-1.44 1.03-1.75.206-.1.428-.164.655-.182z"
+        fill={a.fill}
+      />
+      <Path
+        d="M18.595 3.077c.52-.045 1.032.186 1.4.551.402.434.625 1.006.736 1.584.096.605.09 1.233-.048 1.83a5.97 5.97 0 01-.907 2.19c-.198.25-.382.519-.633.719-.493.45-1.181.725-1.848.598-.42-.08-.819-.306-1.085-.646-.514-.591-.687-1.403-.714-2.17a6.11 6.11 0 011.03-3.285c.237-.314.49-.62.797-.867.375-.27.805-.486 1.272-.504z"
+        fill={b.fill}
+      />
+      <Path
+        d="M5.038 4.172c.618-.045 1.238.067 1.832.235.871.28 1.741.78 2.182 1.624.177.383.256.826.152 1.242-.097.442-.375.816-.71 1.105-.724.59-1.664.84-2.577.887a5.356 5.356 0 01-2.881-.675c-.39-.248-.765-.539-1.025-.93a1.9 1.9 0 01-.327-1.283c.067-.507.357-.968.741-1.289.723-.62 1.684-.873 2.613-.916z"
+        fill={c.fill}
+      />
+      <Path
+        d="M4.87 10.369c.69-.06 1.465.223 1.811.866.213.349.278.763.29 1.166.006.528-.136 1.046-.34 1.529-.34.793-.893 1.478-1.538 2.036-.64.538-1.42.951-2.26 1.015a2.031 2.031 0 01-1.467-.398c-.353-.281-.578-.707-.662-1.15-.156-.8.077-1.62.445-2.327.196-.377.444-.724.72-1.044.767-.886 1.814-1.608 3.001-1.693z"
+        fill={d.fill}
+      />
+      <Path
+        d="M20.391 11.05c.881-.087 1.872.116 2.477.822.473.58.534 1.425.239 2.102-.118.317-.32.59-.527.852-.877.962-2.11 1.553-3.379 1.744-.818.123-1.723.036-2.406-.477-.2-.161-.386-.346-.514-.573-.277-.436-.321-.994-.216-1.492.224-.904.92-1.594 1.676-2.073a5.874 5.874 0 012.65-.905z"
+        fill={e.fill}
+      />
+      <Path
+        d="M7.553 15.523c.381-.052.775.004 1.118.184.344.154.613.427.866.702.866 1.097 1.267 2.549 1.146 3.944a4.476 4.476 0 01-.497 1.61c-.273.469-.663.91-1.187 1.08-.35.103-.731.118-1.077-.005a2.53 2.53 0 01-.959-.612c-.798-.859-1.236-2.02-1.343-3.185-.055-.646-.006-1.31.21-1.923.146-.471.384-.92.738-1.265.261-.277.62-.452.985-.53z"
+        fill={f.fill}
+      />
+      <Path
+        d="M13.637 16.5a4.237 4.237 0 011.82.219c.795.286 1.542.724 2.148 1.323.535.504.963 1.162 1.099 1.899.055.379.038.785-.122 1.138-.19.465-.599.807-1.051.996-.883.364-1.887.253-2.76-.082a5.568 5.568 0 01-2.343-1.685c-.347-.445-.616-.968-.697-1.534-.042-.382-.036-.788.13-1.142.194-.418.55-.76.978-.925.25-.119.525-.174.798-.207z"
+        fill={g.fill}
+      />
+
      <Defs>
-        <LinearGradient gradientUnits="userSpaceOnUse" id={c.id} x1="24" x2="0" y1="0" y2="24">
-          <Stop offset="13%" stopColor="#FF97E3" />
-          <Stop offset="18%" stopColor="#D14FE1" />
-          <Stop offset="33.8%" stopColor="#0050E2" />
-          <Stop offset="66.6%" stopColor="#0050E2" />
-          <Stop offset="80.9%" stopColor="#00DDF4" />
-          <Stop offset="85.8%" stopColor="#23F8CC" />
+        <LinearGradient gradientUnits="userSpaceOnUse" id={a.id} x1="9.789" x2="13" y1="0" y2="7.5">
+          <Stop stopColor="#C65EFF" />
+          <Stop offset="5%" stopColor="#EA4FFF" />
+          <Stop offset="100%" stopColor="#9553FF" />
+        </LinearGradient>
+        <LinearGradient gradientUnits="userSpaceOnUse" id={b.id} x1="19" x2="17" y1="3" y2="10.5">
+          <Stop stopColor="#CF72FF" />
+          <Stop offset="5%" stopColor="#E541FF" />
+          <Stop offset="100%" stopColor="#944DFF" />
+        </LinearGradient>
+        <LinearGradient gradientUnits="userSpaceOnUse" id={c.id} x1="9" x2="2.5" y1="6.5" y2="8">
+          <Stop stopColor="#A555FF" />
+          <Stop offset="5%" stopColor="#DE67FF" />
+          <Stop offset="100%" stopColor="#E581FF" />
+        </LinearGradient>
+        <LinearGradient gradientUnits="userSpaceOnUse" id={d.id} x1="1" x2="6" y1="12" y2="16">
+          <Stop stopColor="#6C48FF" />
+          <Stop offset="30.9%" stopColor="#AA5AFF" />
+          <Stop offset="100%" stopColor="#5145FF" />
+        </LinearGradient>
+        <LinearGradient
+          gradientUnits="userSpaceOnUse"
+          id={e.id}
+          x1="19"
+          x2="21"
+          y1="11.5"
+          y2="16.5"
+        >
+          <Stop stopColor="#CA3EFF" />
+          <Stop offset="5%" stopColor="#AB5CFF" />
+          <Stop offset="100%" stopColor="#5042FF" />
+        </LinearGradient>
+        <LinearGradient gradientUnits="userSpaceOnUse" id={f.id} x1="6" x2="11" y1="20.5" y2="19">
+          <Stop stopColor="#5041FF" />
+          <Stop offset="26%" stopColor="#734FFF" />
+          <Stop offset="75%" stopColor="#6A4CFF" />
+          <Stop offset="100%" stopColor="#483FFF" />
+        </LinearGradient>
+        <LinearGradient
+          gradientUnits="userSpaceOnUse"
+          id={g.id}
+          x1="12"
+          x2="18.5"
+          y1="17.5"
+          y2="21.5"
+        >
+          <Stop stopColor="#7B51FF" />
+          <Stop offset="47.5%" stopColor="#6049FF" />
+          <Stop offset="100%" stopColor="#8466FF" />
        </LinearGradient>
-        <ClipPath id={a.id}>
-          <Path d="M0 0h24v24H0z" fill="#fff" />
-        </ClipPath>
      </Defs>
    </Svg>
  );
@@ -15,8 +15,7 @@ const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }
      {...rest}
    >
      <Path
-        clipRule="evenodd"
-        d="M12 0c6.627 0 12 5.373 12 12s-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0zm0 3.627a8.373 8.373 0 100 16.746 8.373 8.373 0 000-16.746z"
+        d="M10.547.232c.776-.086 1.543.244 2.152.712.784.598 1.375 1.434 1.757 2.347.19.444.3.92.345 1.402.01.384.024.781-.108 1.148-.126.406-.362.795-.728 1.017-.352.236-.786.3-1.199.288-.84-.073-1.613-.52-2.212-1.106-.15-.1-.236-.263-.368-.38-.801-.97-1.394-2.203-1.324-3.496.048-.698.38-1.44 1.03-1.75.206-.1.428-.164.655-.182zM18.595 3.077c.52-.045 1.032.186 1.4.551.402.434.625 1.006.736 1.584.096.605.09 1.233-.048 1.83a5.97 5.97 0 01-.907 2.19c-.198.25-.382.519-.633.719-.493.45-1.181.725-1.848.598-.42-.08-.819-.306-1.085-.646-.514-.591-.687-1.403-.714-2.17a6.11 6.11 0 011.03-3.285c.237-.314.49-.62.797-.867.375-.27.805-.486 1.272-.504zM5.038 4.172c.618-.045 1.238.067 1.832.235.871.28 1.741.78 2.182 1.624.177.383.256.826.152 1.242-.097.442-.375.816-.71 1.105-.724.59-1.664.84-2.577.887a5.356 5.356 0 01-2.881-.675c-.39-.248-.765-.539-1.025-.93a1.9 1.9 0 01-.327-1.283c.067-.507.357-.968.741-1.289.723-.62 1.684-.873 2.613-.916zM4.87 10.369c.69-.06 1.465.223 1.811.866.213.349.278.763.29 1.166.006.528-.136 1.046-.34 1.529-.34.793-.893 1.478-1.538 2.036-.64.538-1.42.951-2.26 1.015a2.031 2.031 0 01-1.467-.398c-.353-.281-.578-.707-.662-1.15-.156-.8.077-1.62.445-2.327.196-.377.444-.724.72-1.044.767-.886 1.814-1.608 3.001-1.693zM20.391 11.05c.881-.087 1.872.116 2.477.822.473.58.534 1.425.239 2.102-.118.317-.32.59-.527.852-.877.962-2.11 1.553-3.379 1.744-.818.123-1.723.036-2.406-.477-.2-.161-.386-.346-.514-.573-.277-.436-.321-.994-.216-1.492.224-.904.92-1.594 1.676-2.073a5.874 5.874 0 012.65-.905zM7.553 15.523c.381-.052.775.004 1.118.184.344.154.613.427.866.702.866 1.097 1.267 2.549 1.146 3.944a4.476 4.476 0 01-.497 1.61c-.273.469-.663.91-1.187 1.08-.35.103-.731.118-1.077-.005a2.53 2.53 0 01-.959-.612c-.798-.859-1.236-2.02-1.343-3.185-.055-.646-.006-1.31.21-1.923.146-.471.384-.92.738-1.265.261-.277.62-.452.985-.53zM13.637 16.5a4.237 4.237 0 011.82.219c.795.286 1.542.724 2.148 1.323.535.504.963 1.162 1.099 1.899.055.379.038.785-.122 1.138-.19.465-.599.807-1.051.996-.883.364-1.887.253-2.76-.082a5.568 5.568 0 01-2.343-1.685c-.347-.445-.616-.968-.697-1.534-.042-.382-.036-.788.13-1.142.194-.418.55-.76.978-.925.25-.119.525-.174.798-.207z"
        fill={color}
      />
    </Svg>
@@ -0,0 +1,22 @@
+import React, { memo } from 'react';
+
+import { RNIconAvatar, type RNIconAvatarProps } from '@/features';
+
+import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
+import Mono from './Mono';
+
+export type AvatarProps = Omit<RNIconAvatarProps, 'Icon'>;
+
+const Avatar = memo<AvatarProps>(({ background, ...rest }) => {
+  return (
+    <RNIconAvatar
+      Icon={Mono}
+      aria-label={TITLE}
+      background={background || AVATAR_BACKGROUND}
+      color={AVATAR_COLOR}
+      iconMultiple={AVATAR_ICON_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+export default Avatar;
@@ -0,0 +1,22 @@
+import React, { memo } from 'react';
+import { Path, Svg } from 'react-native-svg';
+
+import type { RNIconProps } from '@/features';
+
+const Icon = memo<RNIconProps>(({ size = 24, style, ...rest }) => {
+  return (
+    <Svg height={size} style={style} viewBox="0 0 24 24" width={size} {...rest}>
+      <Path d="M12.03 11.936v6.22L6.477 15.05l-.002-6.21 5.557 3.095z" fill="#29C16A" />
+      <Path
+        clipRule="evenodd"
+        d="M10.646.36a2.77 2.77 0 012.729 0l8.284 4.713A2.623 2.623 0 0123 7.347v9.34c0 .936-.511 1.803-1.341 2.276l-8.23 4.678a2.77 2.77 0 01-2.727.001l-8.36-4.745A2.623 2.623 0 011 16.621v-4.553l.001-.002H1V7.36c0-.936.51-1.803 1.34-2.276L10.646.36zm1.882 4.12a1.03 1.03 0 00-1.015 0L5.612 7.838a.975.975 0 00-.498.846v6.643c0 .349.19.671.499.846l5.883 3.349a1.03 1.03 0 001.011.002l5.875-3.306a.977.977 0 00.503-.848v-6.71c0-.349-.19-.671-.5-.847l-5.857-3.331z"
+        fill="#29C16A"
+        fillRule="evenodd"
+      />
+    </Svg>
+  );
+});
+
+Icon.displayName = 'MoxtColor';
+
+export default Icon;
@@ -0,0 +1,28 @@
+import React, { memo } from 'react';
+
+import { RNIconCombine, type RNIconCombineProps } from '@/features';
+
+import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
+import Color from './Color';
+import Mono from './Mono';
+import Text from './Text';
+
+export interface CombineProps extends Omit<RNIconCombineProps, 'Icon' | 'Text'> {
+  type?: 'color' | 'mono';
+}
+const Combine = memo<CombineProps>(({ type = 'mono', ...rest }) => {
+  const Icon = type === 'color' ? Color : Mono;
+
+  return (
+    <RNIconCombine
+      Icon={Icon}
+      Text={Text}
+      aria-label={TITLE}
+      spaceMultiple={COMBINE_SPACE_MULTIPLE}
+      textMultiple={COMBINE_TEXT_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Combine;
@@ -0,0 +1,29 @@
+import React, { memo } from 'react';
+import { Path, Svg } from 'react-native-svg';
+
+import type { RNIconProps } from '@/features';
+
+const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
+  return (
+    <Svg
+      color={color}
+      fillRule="evenodd"
+      height={size}
+      style={style}
+      viewBox="0 0 24 24"
+      width={size}
+      {...rest}
+    >
+      <Path d="M12.03 11.936v6.22L6.477 15.05l-.002-6.21 5.557 3.095z" fill={color} />
+      <Path
+        clipRule="evenodd"
+        d="M10.646.36a2.77 2.77 0 012.729 0l8.284 4.713A2.623 2.623 0 0123 7.347v9.34c0 .936-.511 1.803-1.341 2.276l-8.23 4.678a2.77 2.77 0 01-2.727.001l-8.36-4.745A2.623 2.623 0 011 16.621v-4.553l.001-.002H1V7.36c0-.936.51-1.803 1.34-2.276L10.646.36zm1.882 4.12a1.03 1.03 0 00-1.015 0L5.612 7.838a.975.975 0 00-.498.846v6.643c0 .349.19.671.499.846l5.883 3.349a1.03 1.03 0 001.011.002l5.875-3.306a.977.977 0 00.503-.848v-6.71c0-.349-.19-.671-.5-.847l-5.857-3.331z"
+        fill={color}
+      />
+    </Svg>
+  );
+});
+
+Icon.displayName = 'MoxtMono';
+
+export default Icon;
@@ -0,0 +1,27 @@
+import React, { memo } from 'react';
+import { Path, Svg } from 'react-native-svg';
+
+import type { RNIconProps } from '@/features';
+
+const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
+  return (
+    <Svg
+      color={color}
+      fillRule="evenodd"
+      height={size}
+      style={style}
+      viewBox="0 0 65 24"
+      width={size * 2.71} // 保持宽高比
+      {...rest}
+    >
+      <Path
+        d="M51.87 6.849s.565-.027.295.444l-4.57 7.31a.8.8 0 000 .811l4.55 7.115h-.05c.144.359-.088.467-.098.471h-3.763a.694.694 0 01-.615-.366l-2.361-4.003a.356.356 0 00-.614 0l-2.336 4.003a.694.694 0 01-.616.366H37.56c-.073-.026-.22-.105-.097-.419l4.623-7.141a.798.798 0 000-.811L37.487 7.33c-.295-.47.295-.47.295-.47h3.664c.246 0 .468.13.591.34l2.36 3.845a.356.356 0 00.616 0l2.504-3.883c.147-.183.37-.313.59-.313h3.762zm7.11-4.358c.37 0 .689.314.689.733v3.61h2.706v.025c.369 0 .663.315.663.707v2.067c0 .392-.294.706-.663.706h-2.706v7.246c-.049 1.588 1.558 1.596 1.574 1.596h1.23c.196 0 .565.131.565.811v2.276c0 .392-.295.732-.688.732h-3.148c-1.918 0-3.492-1.674-3.492-3.715V10.34h-1.525c-.368 0-.663-.314-.663-.706V7.566c0-.392.295-.707.663-.707h1.5V3.224c0-.393.296-.733.689-.733h2.606zM29.52 6.075c4.386 0 7.943 3.783 7.943 8.45 0 4.666-3.557 8.45-7.944 8.45-4.386 0-7.943-3.784-7.943-8.45 0-4.667 3.557-8.45 7.944-8.45zM5.934 1c.12 0 .29.153.294.157l4.255 7.115c.123.21.443.21.566 0l4.328-7.115c.048-.102.26-.155.27-.157h3.173c.37 0 .689.314.689.732V22.19c0 .393-.295.733-.689.733h-2.828c-.369 0-.688-.314-.688-.733V9.005c0-.55-.345 0-.345 0l-3.64 6.068a.667.667 0 01-1.155 0l-3.64-5.937s-.27-.419-.32 0v13.053a.752.752 0 01-.688.76H2.64C2.28 22.93 2 22.606 2 22.214V1.732C2 1.34 2.295 1 2.688 1h3.247zm23.584 9.209c-2.241 0-4.058 1.933-4.058 4.316 0 2.384 1.817 4.316 4.058 4.316 2.24 0 4.058-1.932 4.058-4.316 0-2.383-1.817-4.316-4.058-4.316z"
+        fill={color}
+      />
+    </Svg>
+  );
+});
+
+Icon.displayName = 'MoxtText';
+
+export default Icon;
@@ -0,0 +1,25 @@
+import Avatar from './components/Avatar';
+import Color from './components/Color';
+import Combine from './components/Combine';
+import Mono from './components/Mono';
+import Text from './components/Text';
+import { COLOR_PRIMARY, TITLE } from './style';
+
+export type CompoundedIcon = typeof Mono & {
+  Avatar: typeof Avatar;
+  Color: typeof Color;
+  Combine: typeof Combine;
+  Text: typeof Text;
+  colorPrimary: string;
+  title: string;
+};
+
+const Icons = Mono as CompoundedIcon;
+Icons.Color = Color;
+Icons.Text = Text;
+Icons.Combine = Combine;
+Icons.Avatar = Avatar;
+Icons.colorPrimary = COLOR_PRIMARY;
+Icons.title = TITLE;
+
+export default Icons;
@@ -0,0 +1,9 @@
+export const TITLE = 'Moxt';
+export const COMBINE_TEXT_MULTIPLE = 0.8;
+export const COMBINE_SPACE_MULTIPLE = 0.2;
+export const COLOR_PRIMARY = '#29C16A';
+
+// Avatar constants
+export const AVATAR_BACKGROUND = '#fff';
+export const AVATAR_COLOR = COLOR_PRIMARY;
+export const AVATAR_ICON_MULTIPLE = 0.75;
@@ -0,0 +1,22 @@
+import React, { memo } from 'react';
+
+import { RNIconAvatar, type RNIconAvatarProps } from '@/features';
+
+import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
+import Mono from './Mono';
+
+export type AvatarProps = Omit<RNIconAvatarProps, 'Icon'>;
+
+const Avatar = memo<AvatarProps>(({ background, ...rest }) => {
+  return (
+    <RNIconAvatar
+      Icon={Mono}
+      aria-label={TITLE}
+      background={background || AVATAR_BACKGROUND}
+      color={AVATAR_COLOR}
+      iconMultiple={AVATAR_ICON_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+export default Avatar;
@@ -0,0 +1,27 @@
+import React, { memo } from 'react';
+
+import { RNIconCombine, type RNIconCombineProps } from '@/features';
+
+import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
+import Mono from './Mono';
+import Text from './Text';
+
+export type CombineProps = Omit<RNIconCombineProps, 'Icon' | 'Text'>;
+
+const Combine = memo<CombineProps>(({ ...rest }) => {
+  return (
+    <RNIconCombine
+      Icon={Mono}
+      Text={Text as any}
+      aria-label={TITLE}
+      iconProps={{
+        shape: 'square',
+      }}
+      spaceMultiple={COMBINE_SPACE_MULTIPLE}
+      textMultiple={COMBINE_TEXT_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Combine;
@@ -0,0 +1,27 @@
+import React, { memo } from 'react';
+import { Path, Svg } from 'react-native-svg';
+
+import type { RNIconProps } from '@/features';
+
+const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
+  return (
+    <Svg
+      color={color}
+      fillRule="evenodd"
+      height={size}
+      style={style}
+      viewBox="0 0 24 24"
+      width={size}
+      {...rest}
+    >
+      <Path
+        d="M8.46 8.03c3.754-2.568 6.512-2.523 9.28.081 3.337 3.419 3.256 11.234 1.22 14.409-.887 1.459-2.36 1.946-4.313.976-.917-.455-1.39-.784-2.198-1.465-.621-.436-1.052-.585-2.197-.407l-1.791.407c-1.547.244-3.103-.544-3.745-1.058-1.218-.977-1.544-1.791-1.71-3.093-.162-4.314 2.771-8.012 5.455-9.85zM12.05 0a2.652 2.652 0 110 5.305 2.652 2.652 0 010-5.305z"
+        fill={color}
+      />
+    </Svg>
+  );
+});
+
+Icon.displayName = 'OpenHumanMono';
+
+export default Icon;
@@ -0,0 +1,21 @@
+import Avatar from './components/Avatar';
+import Combine from './components/Combine';
+import Mono from './components/Mono';
+import Text from './components/Text';
+import { COLOR_PRIMARY, TITLE } from './style';
+
+export type CompoundedIcon = typeof Mono & {
+  Avatar: typeof Avatar;
+  Combine: typeof Combine;
+  Text: typeof Text;
+  colorPrimary: string;
+  title: string;
+};
+
+const Icons = Mono as CompoundedIcon;
+Icons.Text = Text;
+Icons.Combine = Combine;
+Icons.Avatar = Avatar;
+Icons.colorPrimary = COLOR_PRIMARY;
+Icons.title = TITLE;
+export default Icons;
@@ -0,0 +1,9 @@
+export const TITLE = 'OpenHuman';
+export const COMBINE_TEXT_MULTIPLE = 0.7;
+export const COMBINE_SPACE_MULTIPLE = 0.2;
+export const COLOR_PRIMARY = '#000';
+
+// Avatar constants
+export const AVATAR_BACKGROUND = COLOR_PRIMARY;
+export const AVATAR_COLOR = '#fff';
+export const AVATAR_ICON_MULTIPLE = 0.75;
@@ -3,14 +3,14 @@ import React, { memo } from 'react';
 import { RNIconAvatar, type RNIconAvatarProps } from '@/features';

 import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
-import Mono from './Mono';
+import Color from './Color';

 export type AvatarProps = Omit<RNIconAvatarProps, 'Icon'>;

 const Avatar = memo<AvatarProps>(({ background, ...rest }) => {
  return (
    <RNIconAvatar
-      Icon={Mono}
+      Icon={Color}
      aria-label={TITLE}
      background={background || AVATAR_BACKGROUND}
      color={AVATAR_COLOR}
@@ -2,25 +2,46 @@ import React, { memo } from 'react';
 import { Defs, LinearGradient, Path, Stop, Svg } from 'react-native-svg';

 import type { RNIconProps } from '@/features';
-import { useFillId } from '@/hooks/useFillId';
+import { useFillIds } from '@/hooks/useFillId';

 import { TITLE } from '../style';

 const Icon = memo<RNIconProps>(({ size = 24, style, ...rest }) => {
-  const { id, fill } = useFillId(TITLE);
+  const [a, b] = useFillIds(TITLE, 2);
  return (
    <Svg height={size} style={style} viewBox="0 0 24 24" width={size} {...rest}>
      <Path
-        clipRule="evenodd"
-        d="M17.578 9.384c.48 0 .87.39.87.87v3.867l4.245-3.663a.435.435 0 01.72.329v10.732a.436.436 0 01-.71.339l-4.255-3.441v3.891a.87.87 0 01-.209.565l-.087.088a.87.87 0 01-.686.209L6.559 21.76v1.304a.87.87 0 01-.869.87H.87a.87.87 0 01-.87-.869v-12.81c0-.48.39-.87.87-.871h16.708zm-6.158 4.348H6.978a.435.435 0 00-.435.434v2.847c0 .24.195.434.435.434h4.442c.24 0 .434-.194.435-.434v-2.847a.435.435 0 00-.435-.434zM12.826 0a4.354 4.354 0 110 8.708 4.354 4.354 0 010-8.708zm-7.98 1.313a3.628 3.628 0 110 7.256 3.628 3.628 0 010-7.256z"
-        fill={fill}
-        fillRule="evenodd"
+        d="M10.998 23.837L5 21.015V5.569c0-.733.32-1.547.84-2.065l1.386-1.387 6.064 19.729c.426 1.377-.987 2.605-2.292 1.991z"
+        fill={a.fill}
+      />
+      <Path
+        d="M19.36 8.43L12.517.905A2.765 2.765 0 008.517.81L5.84 3.504c-.511.584-.803 1.198-.803 1.93V20.88l13.699-8.219a2.765 2.765 0 00.623-4.23"
+        fill={b.fill}
      />
      <Defs>
-        <LinearGradient gradientUnits="userSpaceOnUse" id={id} x1="15" x2="-.5" y1="1" y2="24">
-          <Stop stopColor="#E8632A" stopOpacity=".996" />
-          <Stop offset="58.6%" stopColor="#B465E6" stopOpacity=".996" />
-          <Stop offset="100%" stopColor="#979FD9" stopOpacity=".996" />
+        <LinearGradient
+          gradientUnits="userSpaceOnUse"
+          id={a.id}
+          x1="-5.894"
+          x2="13.185"
+          y1="5.53"
+          y2="23.781"
+        >
+          <Stop stopColor="#FE9E58" />
+          <Stop offset="39.6%" stopColor="#E470EC" />
+          <Stop offset="100%" stopColor="#442FBA" />
+        </LinearGradient>
+        <LinearGradient
+          gradientUnits="userSpaceOnUse"
+          id={b.id}
+          x1="15.931"
+          x2="-3.149"
+          y1="5.396"
+          y2="23.647"
+        >
+          <Stop stopColor="#FFA052" />
+          <Stop offset="39.6%" stopColor="#E36CFA" stopOpacity=".8" />
+          <Stop offset="100%" stopColor="#442FBA" stopOpacity=".7" />
        </LinearGradient>
      </Defs>
    </Svg>
@@ -15,9 +15,14 @@ const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }
      {...rest}
    >
      <Path
-        clipRule="evenodd"
-        d="M17.578 9.384c.48 0 .87.39.87.87v3.867l4.245-3.663a.435.435 0 01.72.329v10.732a.436.436 0 01-.71.339l-4.255-3.441v3.891a.87.87 0 01-.209.565l-.087.088a.87.87 0 01-.686.209L6.559 21.76v1.304a.87.87 0 01-.869.87H.87a.87.87 0 01-.87-.869v-12.81c0-.48.39-.87.87-.871h16.708zm-6.158 4.348H6.978a.435.435 0 00-.435.434v2.847c0 .24.195.434.435.434h4.442c.24 0 .434-.194.435-.434v-2.847a.435.435 0 00-.435-.434zM12.826 0a4.354 4.354 0 110 8.708 4.354 4.354 0 010-8.708zm-7.98 1.313a3.628 3.628 0 110 7.256 3.628 3.628 0 010-7.256z"
+        d="M10.998 23.837L5 21.015V5.569c0-.733.32-1.547.84-2.065l1.386-1.387 6.064 19.729c.426 1.377-.987 2.605-2.292 1.991z"
        fill={color}
+        opacity=".8"
+      />
+      <Path
+        d="M19.36 8.43L12.517.905A2.765 2.765 0 008.517.81L5.84 3.504c-.511.584-.803 1.198-.803 1.93V20.88l13.699-8.219a2.765 2.765 0 00.623-4.23"
+        fill={color}
+        opacity=".8"
      />
    </Svg>
  );
@@ -3,7 +3,7 @@ import Color from './components/Color';
 import Combine from './components/Combine';
 import Mono from './components/Mono';
 import Text from './components/Text';
-import { COLOR_GRADIENT, COLOR_PRIMARY, TITLE } from './style';
+import { COLOR_PRIMARY, TITLE } from './style';

 export type CompoundedIcon = typeof Mono & {
  Avatar: typeof Avatar;
@@ -21,7 +21,6 @@ Icons.Text = Text;
 Icons.Combine = Combine;
 Icons.Avatar = Avatar;
 Icons.colorPrimary = COLOR_PRIMARY;
-Icons.colorGradient = COLOR_GRADIENT;
 Icons.title = TITLE;

 export default Icons;
@@ -1,10 +1,9 @@
 export const TITLE = 'PixVerse';
-export const COMBINE_TEXT_MULTIPLE = 0.7;
+export const COMBINE_TEXT_MULTIPLE = 0.85;
 export const COMBINE_SPACE_MULTIPLE = 0.3;
-export const COLOR_PRIMARY = '#9727ef';
-export const COLOR_GRADIENT = 'linear-gradient(45deg, #3961f1, #9727ef, #ff601a)';
+export const COLOR_PRIMARY = '#000';

 // Avatar constants
-export const AVATAR_BACKGROUND = COLOR_GRADIENT;
-export const AVATAR_COLOR = '#000';
+export const AVATAR_BACKGROUND = COLOR_PRIMARY;
+export const AVATAR_COLOR = '#fff';
 export const AVATAR_ICON_MULTIPLE = 0.65;
@@ -0,0 +1,22 @@
+import React, { memo } from 'react';
+
+import { RNIconAvatar, type RNIconAvatarProps } from '@/features';
+
+import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
+import Color from './Color';
+
+export type AvatarProps = Omit<RNIconAvatarProps, 'Icon'>;
+
+const Avatar = memo<AvatarProps>(({ background, ...rest }) => {
+  return (
+    <RNIconAvatar
+      Icon={Color}
+      aria-label={TITLE}
+      background={background || AVATAR_BACKGROUND}
+      color={AVATAR_COLOR}
+      iconMultiple={AVATAR_ICON_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+export default Avatar;
@@ -0,0 +1,23 @@
+import React, { memo } from 'react';
+import { Path, Svg } from 'react-native-svg';
+
+import type { RNIconProps } from '@/features';
+
+const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
+  return (
+    <Svg color={color} height={size} style={style} viewBox="0 0 24 24" width={size} {...rest}>
+      <Path
+        d="M21.73 1.6l-.138.25-3.28.007-2.659 3.046c-1.472-.88-3.133-.05-3.549.7-.072.13-.102.108-.43-.22-1.034-1.073-2.492-.795-2.893-.601-.342.164-.357.164-.48.035-.897-.987-1.771-1.98-2.653-2.967L2.42 1.842l-.146-.228C1.684.69.226.956.022 2.02c-.247 1.295 1.633 2.01 2.267.844l.13-.229h2.865l2.477 2.79c-.197.385-.437.757-.532 1.186-.036.23-.102.308-.35.45-.364.215-.67.509-.983.795-.773.007-1.742.114-1.866-.859-.029-1.015-1.013-1.458-1.8-1.05-.867.45-.852 1.737.03 2.152.306.143.786.15 1.056.014.547-.279.357.53 1.567.53.452 0 .503.014.452.128-.073.937-.263.772-.744 2.775l-1.785.042-.306-.314c-.86-.901-2.157-.393-2.157.75 0 1.166 1.472 1.76 2.28.58l.212-.308 1.764.043c.415 1.824.743 1.23.56 1.938-.138 1.295-.495.959-1.58.959l-.875.636C.722 15.287.292 17.418 1.37 17.954c.853.43 1.815-.129 1.815-1.044 0-.365.007-.386.342-.636.438-.365 1.042-.236 1.574-.215.387.686.897 1.33 1.75 1.437.662.086.32.422 1.056 1.288l-2.325 2.603h-2.23l-.174-.265c-.46-.68-1.589-.765-2.092.093-.583 1.001.518 2.138 1.552 1.68.277-.121.693-.514.693-.657.874-.115 1.778-.065 2.66-.065l1.267-1.437c1.042-1.18 1.298-1.43 1.421-1.402 1.487.386 2.361 0 3.33-1.044.212.272 1.24 1.438 2.843 1.059.502-.122.51-.122.633.021.817.93 1.64 1.86 2.456 2.789l2.638.007.175.272c.656 1.001 2.346.58 2.237-.744-.11-1.316-1.734-1.373-2.244-.565l-.16.25h-2.238l-2.332-2.653c.3-.343.525-.715.67-1.144.096-.293 1.24.115 2.158-1.566.772-.014 1.865-.1 1.975.887 0 .922.962 1.473 1.814 1.044 1.079-.536.809-2.84-1.333-2.081-.75-.586-.7-.636-1.582-.636-1.042.085-.7-.401-.881-1.08-.183-.594.123-.122.539-1.853h1.865l.088.215c.422.994 2.332.965 2.332-.508 0-1.366-1.72-1.523-2.216-.7l-.123.207c-.343-.029-1.932.129-1.96-.165 0-.736-.562-1.265-.657-2.696.489 0 .94.036 1.327-.336.386-.286.459-.322.583-.243.925.565 2.433-.686 1.552-1.816-.692-.894-2.288-.408-2.215.8-.03.88-1.043.809-1.698.809-.35-.308-.7-.637-1.108-.866-.649-.336-.19-.55-.918-1.551.816-.93 1.625-1.867 2.441-2.797h2.915l.146.23c.728 1.13 2.586.385 2.222-.937-.35-1.288-1.749-1.109-2.222-.344zm-6.135 4.254c.466.508.605 1.137.4 1.802-.109.365-.597.901-.968 1.066-1.079.479-.197-.937-.984-.937-.35 0-.408.143-.3.722.081.458.03.901-.036 1.36.204 0 .634.128.766-.015.021-.036.13-.286.298-.315 1.553-.243 1.975-1.902 2.04-1.902.154 0 1.808 1.266 1.006 2.66-.473-.129-1.574-1.552-1.807-.529 0 .264 1.625 1.38 1.567 1.895-.073.665.386.694.576.508.094-.093.116-.236.102-.715.102-2.246.75 2.023-.117 1.609-.466-.4-1.457-.615-1.807-.386-.284.178-.306.758.277.65.546-.1 1.144.236 1.399.787.473 1.022.175 2.181-.663 2.553-1.276.565-.19-3.333-3.979-.923-.43.372-.525.58-.35.758.277.194 2.004-.708 2.368-.85.897.386 1.079 2.502-.546 3.046-.904.3-1.85-.1-2.288-.958-.168-.322-.168-.358-.19-3.526V8.207c.03-1.702.073-1.874.554-2.367.678-.694 1.895-.844 2.682.014zm-4.03 11.678c-.007.422-.714 1.273-1.785 1.273-1.18 0-3.054-1.552-.795-3.826.489.508.853 1.152 1.45 1.545.547.336.766-.136.59-.4a20.622 20.622 0 00-1.209-1.366c.007-.444 0-.937 0-1.38-.05 0-.634-.015-.656 0-.022.02-.036.435-.036.714-.066.673-1.581.63-1.836 2.475-.102.708-1.21-.072-1.392-.672-.11-.372-.11-1.173 0-1.545.24-.78 1.26-1.094 1.545-1.173-.153-.179-.35-.35-.43-.58 0-.27-1.261.702-1.356.559-.685-1.044.153-3.776.08-1.588-.021.587.051.73.365.73.262 0 .357-.172.306-.544-.044-.307.634-1.824 1.537-1.824-.291-1.373-1.748 1.059-1.967-.05-.262-1.337 1.144-2.16 1.202-2.16.037 0 .386 1.102 1.276 1.61.568.329 1.18.529 1.836.529-.277-1.795.357-2.067-.306-2.067-.656 0-.131 1.28-.86 1.037C8.089 8.48 7.6 7.25 8.118 6.283c.846-1.587 3.127-1.008 3.265.043l.182 11.206z"
+        fill="#A11B1B"
+      />
+      <Path
+        d="M8.14 15.866c-1.457-.071-1.384-.028-1.384-.722 0-.315.029-.558.058-.537.029.022.809.058 1.734.08 2.033.056 1.96.078 1.96-.694v-.523H9.233c-1.829 0-2.215-.15-2.456-.958-.174-.58-.109-1.752.11-2.102.313-.494.56-.58 1.829-.637.707-.028 1.144-.043 2.842.036v1.123H10.18c-1.334 0-1.72.05-1.844.236-.095.143-.066.73.044.872.255.343 2.28-.021 3.024.386.503.272.575.615.605 1.53.029.902-.015 1.224-.321 1.531-.445.443-.925.493-3.563.365l.014.014zm5.75-.05c.036-1.616-.022-3.232-.03-4.849l-1.858.015v-1.23h5.283l.044 1.173-1.865.042c-.037 1.588.036 3.254-.022 4.849-.022.236-1.552.164-1.552 0z"
+        fill={color}
+      />
+    </Svg>
+  );
+});
+
+Icon.displayName = 'SillyTavernColor';
+
+export default Icon;
@@ -0,0 +1,28 @@
+import React, { memo } from 'react';
+
+import { RNIconCombine, type RNIconCombineProps } from '@/features';
+
+import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
+import Color from './Color';
+import Mono from './Mono';
+import Text from './Text';
+
+export interface CombineProps extends Omit<RNIconCombineProps, 'Icon' | 'Text'> {
+  type?: 'color' | 'mono';
+}
+const Combine = memo<CombineProps>(({ type = 'mono', ...rest }) => {
+  const Icon = type === 'color' ? Color : Mono;
+
+  return (
+    <RNIconCombine
+      Icon={Icon}
+      Text={Text}
+      aria-label={TITLE}
+      spaceMultiple={COMBINE_SPACE_MULTIPLE}
+      textMultiple={COMBINE_TEXT_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Combine;
@@ -0,0 +1,36 @@
+import React, { memo } from 'react';
+import { Path, Svg } from 'react-native-svg';
+
+import type { RNIconProps } from '@/features';
+
+const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
+  return (
+    <Svg
+      color={color}
+      fillRule="evenodd"
+      height={size}
+      style={style}
+      viewBox="0 0 24 24"
+      width={size}
+      {...rest}
+    >
+      <Path
+        d="M8.14 15.866c-1.457-.071-1.384-.028-1.384-.722 0-.315.029-.558.058-.537.029.022.809.058 1.734.08 2.033.056 1.96.078 1.96-.694v-.523H9.233c-1.829 0-2.215-.15-2.456-.958-.174-.58-.109-1.752.11-2.102.313-.494.56-.58 1.829-.637.707-.028 1.144-.043 2.842.036v1.123H10.18c-1.334 0-1.72.05-1.844.236-.095.143-.066.73.044.872.255.343 2.28-.021 3.024.386.503.272.575.615.605 1.53.029.902-.015 1.224-.321 1.531-.445.443-.925.493-3.563.365l.014.014zm5.75-.05c.036-1.616-.022-3.232-.03-4.849l-1.858.015v-1.23h5.283l.044 1.173-1.865.042c-.037 1.588.036 3.254-.022 4.849-.022.236-1.552.164-1.552 0z"
+        fill={color}
+      />
+      <Path
+        d="M13.29 15.816a.64.64 0 00.229.487c.05.043.102.073.145.095-.307.108-.557.168-.65.104-.163-.167-.089-.36.275-.69v.004zM12.36 12.546a1.55 1.55 0 00-.667-.646 1.64 1.64 0 00-.222-.1l-.003-.215.892-.007v.968z"
+        fill={color}
+      />
+      <Path
+        clipRule="evenodd"
+        d="M21.73 1.599c.474-.765 1.874-.943 2.223.344.365 1.323-1.494 2.066-2.222.936l-.146-.228H18.67c-.816.93-1.625 1.866-2.441 2.796.728 1 .27 1.215.918 1.551.408.23.758.558 1.108.865.656 0 1.668.072 1.697-.807-.073-1.209 1.524-1.695 2.216-.8.881 1.129-.627 2.38-1.553 1.816-.123-.08-.196-.043-.583.243-.386.371-.838.336-1.326.336.095 1.43.656 1.959.657 2.695.029.293 1.617.136 1.96.165l.123-.207c.496-.822 2.215-.666 2.215.7 0 1.473-1.908 1.502-2.33.508l-.089-.215h-1.865c-.415 1.73-.721 1.26-.539 1.853.182.679-.16 1.165.88 1.08.883 0 .832.05 1.583.636 2.142-.758 2.411 1.544 1.333 2.08-.853.43-1.814-.12-1.814-1.043-.11-.987-1.203-.901-1.975-.887-.918 1.68-2.063 1.273-2.157 1.566-.146.43-.371.802-.67 1.145l2.332 2.652h2.236l.161-.25c.51-.808 2.135-.75 2.244.566.11 1.322-1.581 1.744-2.237.743l-.175-.272-2.637-.007c-.817-.93-1.64-1.86-2.457-2.789-.123-.143-.13-.143-.633-.021-1.603.379-2.63-.787-2.842-1.059-.97 1.044-1.844 1.43-3.33 1.044-.124-.028-.38.222-1.422 1.402L5.99 22.173c-.881 0-1.785-.05-2.66.065 0 .143-.414.536-.691.658-1.035.457-2.136-.68-1.553-1.68.503-.86 1.633-.773 2.092-.094l.175.265h2.23l2.324-2.604c-.735-.865-.394-1.2-1.056-1.287-.853-.107-1.363-.75-1.75-1.437-.531-.022-1.136-.15-1.573.215-.336.25-.343.272-.343.636 0 .916-.962 1.473-1.815 1.044-1.078-.536-.648-2.667 1.334-2.08l.874-.638c1.086 0 1.443.337 1.581-.958.183-.707-.145-.114-.56-1.938l-1.764-.043-.21.308c-.81 1.18-2.282.586-2.282-.58 0-1.143 1.297-1.651 2.157-.75l.306.314 1.785-.042c.481-2.002.671-1.838.744-2.775.05-.114 0-.13-.452-.13-1.21 0-1.02-.806-1.566-.528-.27.136-.751.129-1.057-.014-.882-.415-.897-1.702-.03-2.153.788-.407 1.771.036 1.8 1.051.124.973 1.093.866 1.866.859.313-.286.619-.58.983-.794.248-.143.314-.222.35-.45.095-.43.335-.802.532-1.188L5.283 2.636H2.42l-.132.23c-.634 1.164-2.513.45-2.265-.844.204-1.066 1.66-1.33 2.25-.409l.147.229 3.228.008c.881.987 1.757 1.98 2.653 2.968.124.128.138.128.48-.037.401-.193 1.858-.471 2.893.601.328.329.358.35.43.222.416-.751 2.078-1.58 3.55-.7l2.659-3.047 3.279-.007.139-.251zm-6.135 4.256c-.787-.858-2.004-.709-2.682-.015-.48.493-.524.665-.553 2.367v.945h-.931l-.046-2.826c-.138-1.05-2.42-1.63-3.265-.043-.517.966-.029 2.196 1.006 2.546.728.243.204-1.036.86-1.037.565 0 .189.198.237 1.368a20.158 20.158 0 00-1.53.013l-.002.001c-.154.007-.3.014-.436.023-.741-.544-1.042-1.476-1.075-1.476-.064.003-1.464.825-1.202 2.16.055.28.19.332.365.277-.09.168-.143.362-.177.527a4.618 4.618 0 00-.079.658c-.016.303-.008.643.036.952l-.021.002c-.313 0-.386-.142-.364-.728.072-2.189-.765.542-.08 1.586.042.065.32-.098.614-.271.062.168.144.334.26.485.037.048.078.092.119.133-.32.186-.633.46-.753.848-.11.372-.11 1.173 0 1.545.182.6 1.29 1.38 1.391.672.007-.05.015-.1.024-.147.185.014.421.026.703.04-.44 1.44.864 2.345 1.765 2.345 1.072 0 1.778-.85 1.786-1.273l-.02-1.23a1.78 1.78 0 00.568-.392c.103-.103.188-.212.257-.33.017 1.822.04 1.893.179 2.16.437.858 1.385 1.258 2.288.958 1.22-.408 1.42-1.701 1.066-2.485a.64.64 0 00.136-.342l.002-.033c.008-.208.013-.417.017-.627.603.558.53 1.791 1.286 1.456.838-.372 1.137-1.53.663-2.554-.255-.55-.853-.886-1.4-.786-.582.107-.56-.471-.276-.65.35-.229 1.34-.015 1.807.386.867.414.22-3.854.117-1.61.015.48-.008.623-.102.716-.19.186-.648.157-.576-.508a.338.338 0 00-.023-.142l.397-.009-.052-1.378c.592-1.329-.94-2.497-1.087-2.497-.05.001-.306.95-1.099 1.517h-1.932c.009-.214.001-.428-.037-.645-.109-.579-.05-.722.3-.722.785 0-.096 1.416.983.937.371-.165.859-.7.968-1.066.204-.664.066-1.294-.4-1.801z"
+        fill={color}
+      />
+    </Svg>
+  );
+});
+
+Icon.displayName = 'SillyTavernMono';
+
+export default Icon;
@@ -0,0 +1,27 @@
+import React, { memo } from 'react';
+import { Path, Svg } from 'react-native-svg';
+
+import type { RNIconProps } from '@/features';
+
+const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
+  return (
+    <Svg
+      color={color}
+      fillRule="evenodd"
+      height={size}
+      style={style}
+      viewBox="0 0 104 24"
+      width={size * 4.33} // 保持宽高比
+      {...rest}
+    >
+      <Path
+        d="M32.983 17.063h.125L36.42 7.5h2l-5.093 13.75c-.229.62-.513 1.133-.851 1.54a3.193 3.193 0 01-1.18.913 3.638 3.638 0 01-1.5.297c-.313 0-.591-.026-.836-.078-.245-.047-.414-.094-.508-.14l.469-1.626c.448.115.844.157 1.187.125.344-.031.649-.185.915-.46.27-.272.518-.712.742-1.321l.343-.938L27.671 7.5h2l3.312 9.563zM7.906 3.28c1.031 0 1.948.185 2.75.555.802.365 1.438.865 1.906 1.5.474.635.725 1.357.75 2.164h-1.874a2.453 2.453 0 00-1.141-1.844C9.63 5.22 8.812 5 7.844 5c-.709 0-1.328.115-1.86.344-.526.229-.937.544-1.234.945a2.267 2.267 0 00-.438 1.367c0 .427.102.795.305 1.102.208.302.474.555.797.758.323.198.662.362 1.016.492.354.125.68.226.976.305l1.625.437c.417.11.88.26 1.39.453a6.42 6.42 0 011.477.79c.474.327.865.75 1.172 1.265.307.515.461 1.148.461 1.898 0 .865-.226 1.646-.68 2.344-.447.698-1.104 1.253-1.968 1.664-.86.412-1.904.617-3.133.617-1.146 0-2.138-.185-2.977-.554-.833-.37-1.49-.886-1.968-1.547-.474-.662-.742-1.43-.805-2.305h2c.052.604.255 1.104.61 1.5a3.3 3.3 0 001.359.875 5.504 5.504 0 001.781.281c.74 0 1.404-.12 1.992-.36.589-.244 1.055-.582 1.399-1.015.343-.437.515-.948.515-1.531 0-.531-.148-.964-.445-1.297-.297-.333-.688-.604-1.172-.812a12.315 12.315 0 00-1.57-.547L6.5 11.906c-1.25-.36-2.24-.872-2.969-1.539-.729-.666-1.093-1.539-1.094-2.617 0-.896.243-1.677.727-2.344.49-.672 1.146-1.192 1.969-1.562.828-.375 1.752-.563 2.773-.563zm47.511 4.062c.385 0 .828.047 1.328.14.505.089.992.274 1.461.555.474.281.867.706 1.18 1.274.312.567.468 1.328.468 2.28V19.5h-1.843v-1.625h-.094c-.125.26-.333.54-.625.836-.292.297-.68.55-1.164.758-.484.208-1.076.312-1.773.312-.76 0-1.451-.143-2.07-.43a3.553 3.553 0 01-1.476-1.257c-.365-.552-.547-1.219-.547-2 0-.688.135-1.245.406-1.672.27-.432.633-.771 1.086-1.016a5.706 5.706 0 011.499-.547 18.255 18.255 0 011.664-.296c.729-.094 1.32-.164 1.773-.211.459-.053.792-.139 1-.258.214-.12.32-.328.32-.625v-.063c0-.77-.21-1.37-.632-1.797-.417-.427-1.05-.64-1.898-.64-.88 0-1.57.193-2.07.578-.5.385-.852.797-1.055 1.234l-1.75-.625c.313-.729.729-1.297 1.25-1.703a4.686 4.686 0 011.718-.86 7.14 7.14 0 011.844-.25zm22.272 0a5.69 5.69 0 011.852.312 4.59 4.59 0 011.664 1.016c.5.463.898 1.078 1.195 1.844.297.765.446 1.708.446 2.828v.781h-8.713c.026.798.18 1.483.463 2.055.317.625.758 1.101 1.32 1.43.562.322 1.216.484 1.961.484a3.99 3.99 0 001.313-.203c.395-.141.736-.35 1.023-.625a2.84 2.84 0 00.664-1.047l1.781.5a3.95 3.95 0 01-.945 1.593c-.443.454-.99.808-1.64 1.063-.652.25-1.384.375-2.196.375-1.156 0-2.154-.255-2.992-.766-.833-.515-1.477-1.234-1.93-2.156-.448-.927-.672-2.005-.672-3.234 0-1.23.224-2.313.672-3.25.453-.943 1.084-1.677 1.89-2.203.813-.532 1.761-.797 2.844-.797zM17.431 19.5h-1.844v-12h1.844v12zm4.34 0h-1.844v-16h1.843v16zm4.34 0h-1.843v-16h1.843v16zM50.597 5.219h-5.032V19.5h-1.937V5.219h-5.031V3.5h12v1.719zm15.688 11.843h.125L69.723 7.5h2l-4.438 12H65.41l-4.437-12h2l3.312 9.563zM90.31 7.32c.202.006.356.013.46.024v1.875a5.453 5.453 0 00-.428-.07 4.235 4.235 0 00-.695-.055c-.584 0-1.105.122-1.563.367a2.77 2.77 0 00-1.078 1c-.26.422-.39.904-.39 1.445V19.5H84.77v-12h1.78v1.813h.126c.218-.594.614-1.076 1.187-1.446a3.496 3.496 0 011.938-.554c.135 0 .304.002.507.007zm7.204.024c.812 0 1.523.166 2.132.5.61.328 1.084.828 1.422 1.5.339.666.508 1.51.508 2.531v7.625h-1.844v-7.5c0-.943-.244-1.677-.734-2.203-.49-.531-1.162-.797-2.016-.797-.588 0-1.114.128-1.578.383a2.74 2.74 0 00-1.086 1.117c-.265.49-.398 1.083-.398 1.781V19.5h-1.844v-12h1.781v1.875h.157a3.428 3.428 0 011.28-1.469c.574-.375 1.313-.562 2.22-.562zM58.01 13.468c-.078.094-.25.18-.516.258a8.71 8.71 0 01-.906.195c-.339.052-.67.099-.992.14a48.87 48.87 0 00-.774.094 7.045 7.045 0 00-1.343.305 2.318 2.318 0 00-1 .617c-.25.27-.375.64-.375 1.11 0 .64.237 1.124.71 1.453.48.322 1.087.484 1.82.484.73 0 1.345-.143 1.845-.43.505-.286.885-.656 1.14-1.109.26-.453.39-.93.39-1.43v-1.687zm19.678-4.469c-.734 0-1.37.182-1.906.547-.531.36-.94.828-1.226 1.406a4.103 4.103 0 00-.42 1.578h6.834c0-.677-.136-1.281-.407-1.812a3.063 3.063 0 00-1.14-1.258c-.49-.307-1.068-.461-1.735-.461zM16.524 3c.36 0 .667.122.922.367.26.245.39.54.39.883 0 .344-.13.638-.39.883a1.285 1.285 0 01-.922.367c-.359 0-.669-.123-.93-.367a1.18 1.18 0 01-.382-.883c0-.344.127-.638.383-.883.26-.244.57-.367.93-.367z"
+        fill={color}
+      />
+    </Svg>
+  );
+});
+
+Icon.displayName = 'SillyTavernText';
+
+export default Icon;
@@ -0,0 +1,25 @@
+import Avatar from './components/Avatar';
+import Color from './components/Color';
+import Combine from './components/Combine';
+import Mono from './components/Mono';
+import Text from './components/Text';
+import { COLOR_PRIMARY, TITLE } from './style';
+
+export type CompoundedIcon = typeof Mono & {
+  Avatar: typeof Avatar;
+  Color: typeof Color;
+  Combine: typeof Combine;
+  Text: typeof Text;
+  colorPrimary: string;
+  title: string;
+};
+
+const Icons = Mono as CompoundedIcon;
+Icons.Color = Color;
+Icons.Text = Text;
+Icons.Combine = Combine;
+Icons.Avatar = Avatar;
+Icons.colorPrimary = COLOR_PRIMARY;
+Icons.title = TITLE;
+
+export default Icons;
@@ -0,0 +1,9 @@
+export const TITLE = 'SillyTavern';
+export const COMBINE_TEXT_MULTIPLE = 0.8;
+export const COMBINE_SPACE_MULTIPLE = 0.2;
+export const COLOR_PRIMARY = '#333';
+
+// Avatar constants
+export const AVATAR_BACKGROUND = COLOR_PRIMARY;
+export const AVATAR_COLOR = '#fff';
+export const AVATAR_ICON_MULTIPLE = 0.75;
@@ -0,0 +1,22 @@
+import React, { memo } from 'react';
+
+import { RNIconAvatar, type RNIconAvatarProps } from '@/features';
+
+import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
+import Inner from './Inner';
+
+export type AvatarProps = Omit<RNIconAvatarProps, 'Icon'>;
+
+const Avatar = memo<AvatarProps>(({ background, ...rest }) => {
+  return (
+    <RNIconAvatar
+      Icon={Inner}
+      aria-label={TITLE}
+      background={background || AVATAR_BACKGROUND}
+      color={AVATAR_COLOR}
+      iconMultiple={AVATAR_ICON_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+export default Avatar;
@@ -0,0 +1,27 @@
+import React, { memo } from 'react';
+
+import { RNIconCombine, type RNIconCombineProps } from '@/features';
+
+import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
+import Mono from './Mono';
+import Text from './Text';
+
+export type CombineProps = Omit<RNIconCombineProps, 'Icon' | 'Text'>;
+
+const Combine = memo<CombineProps>(({ ...rest }) => {
+  return (
+    <RNIconCombine
+      Icon={Mono}
+      Text={Text as any}
+      aria-label={TITLE}
+      iconProps={{
+        shape: 'square',
+      }}
+      spaceMultiple={COMBINE_SPACE_MULTIPLE}
+      textMultiple={COMBINE_TEXT_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Combine;
@@ -0,0 +1,23 @@
+import React, { memo } from 'react';
+import { Path, Svg } from 'react-native-svg';
+
+import type { RNIconProps } from '@/features';
+
+const Icon = memo<RNIconProps>(({ size = 24, style, ...rest }) => {
+  return (
+    <Svg height={size} style={style} viewBox="0 0 24 24" width={size} {...rest}>
+      <Path
+        d="M18.528 1.038c.674-.106 1.387.003 1.93.425.385.298 1.335 1.114 1.602 1.33.536.432.941.982 1.061 1.66l.84 4.753a2.579 2.579 0 01-2.078 2.974l-.272.05c.053.146.098.298.125.455l.824 4.661a2.573 2.573 0 01-2.092 2.977L5.458 22.96c-1.151.202-1.604-.37-2.757-1.393-.993-.886-1.675-1.345-1.867-2.235l-.75-4.237c-.157-.9-.123-1.417.358-2.119.442-.648 1.168-.977 2.086-1.14a2.779 2.779 0 01-.118-.43l-.656-3.71c-.175-.992-.397-1.962.35-2.969.646-.869 1.483-1.063 2.532-1.217l13.892-2.472zm-10.27 15.19c-.193.174-.633.406-1.086.3-.394-.093-.68-.436-.752-.835l-.409-2.31-3.1.545a.853.853 0 00-.693.986l.683 3.856a.855.855 0 00.99.691v.003l14.204-2.495a.853.853 0 00.694-.987l-.683-3.859a.855.855 0 00-.99-.69l-1.253.22c-.417.074-1.12-.183-1.24-.861l-.22-1.236-6.145 6.671zm11.23-12.33a.855.855 0 00-.993-.69L4.433 5.701a.85.85 0 00-.691.986l.699 3.947v.003a.854.854 0 00.989.691l1.26-.22a1.065 1.065 0 011.234.861l.219 1.236 6.146-6.672a1.069 1.069 0 011.838.535l.408 2.304 2.963-.537a.852.852 0 00.689-.986l-.699-3.952z"
+        fill="#000"
+      />
+      <Path
+        d="M8.258 16.228c-.193.175-.633.407-1.086.3-.394-.093-.68-.435-.752-.835l-.409-2.31-3.1.546a.853.853 0 00-.693.985l.683 3.857a.855.855 0 00.99.69v.004l14.205-2.496a.853.853 0 00.693-.986l-.683-3.86a.855.855 0 00-.99-.69c-.465.082-.99.175-1.253.22-.417.074-1.12-.183-1.24-.86l-.22-1.237-6.145 6.672zm11.23-12.33a.855.855 0 00-.993-.69L4.433 5.703a.85.85 0 00-.691.985l.699 3.947v.004a.854.854 0 00.989.69l1.26-.22a1.065 1.065 0 011.234.861l.219 1.236 6.146-6.671a1.069 1.069 0 011.838.534l.408 2.304 2.963-.536a.852.852 0 00.689-.986l-.699-3.952z"
+        fill="#fff"
+      />
+    </Svg>
+  );
+});
+
+Icon.displayName = 'SlockInner';
+
+export default Icon;
@@ -0,0 +1,27 @@
+import React, { memo } from 'react';
+import { Path, Svg } from 'react-native-svg';
+
+import type { RNIconProps } from '@/features';
+
+const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
+  return (
+    <Svg
+      color={color}
+      fillRule="evenodd"
+      height={size}
+      style={style}
+      viewBox="0 0 24 24"
+      width={size}
+      {...rest}
+    >
+      <Path
+        d="M18.528 1.038c.674-.106 1.387.003 1.93.425.385.298 1.335 1.114 1.602 1.33.536.432.941.982 1.061 1.66l.84 4.753a2.579 2.579 0 01-2.078 2.974l-.272.05c.053.146.098.298.125.455l.824 4.661a2.573 2.573 0 01-2.092 2.977L5.458 22.96c-1.151.202-1.604-.37-2.757-1.393-.993-.886-1.675-1.345-1.867-2.235l-.75-4.237c-.157-.9-.123-1.417.358-2.119.442-.648 1.168-.977 2.086-1.14a2.779 2.779 0 01-.118-.43l-.656-3.71c-.175-.992-.397-1.962.35-2.969.646-.869 1.483-1.063 2.532-1.217l13.892-2.472zm-10.27 15.19c-.193.174-.633.406-1.086.3-.394-.093-.68-.436-.752-.835l-.409-2.31-3.1.545a.853.853 0 00-.693.986l.683 3.856a.855.855 0 00.99.691v.003l14.204-2.495a.853.853 0 00.694-.987l-.683-3.859a.855.855 0 00-.99-.69l-1.253.22c-.417.074-1.12-.183-1.24-.861l-.22-1.236-6.145 6.671zm11.23-12.33a.855.855 0 00-.993-.69L4.433 5.701a.85.85 0 00-.691.986l.699 3.947v.003a.854.854 0 00.989.691l1.26-.22a1.065 1.065 0 011.234.861l.219 1.236 6.146-6.672a1.069 1.069 0 011.838.535l.408 2.304 2.963-.537a.852.852 0 00.689-.986l-.699-3.952z"
+        fill={color}
+      />
+    </Svg>
+  );
+});
+
+Icon.displayName = 'SlockMono';
+
+export default Icon;
@@ -0,0 +1,27 @@
+import React, { memo } from 'react';
+import { Path, Svg } from 'react-native-svg';
+
+import type { RNIconProps } from '@/features';
+
+const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
+  return (
+    <Svg
+      color={color}
+      fillRule="evenodd"
+      height={size}
+      style={style}
+      viewBox="0 0 92 24"
+      width={size * 3.83} // 保持宽高比
+      {...rest}
+    >
+      <Path
+        d="M13.02 0c2.609 0 4.6.526 6.082 1.619.12.087.23.184.334.291.287.26.539.524.763.798.183-.489.39-.88.642-1.21A2.746 2.746 0 0123.16.42c.103.006.244.006.427.006h.484l1.736-.02h.034c3.338-.011 4.298.162 5.675 1.612.215.225 1.077 1.07 1.416 1.643a2.78 2.78 0 01.31 2.035c.136-.207.274-.405.419-.6a12.594 12.594 0 014.799-3.793C40.278.478 42.098.061 44.093.061s3.784.43 5.313 1.272c.935.514 3.127 2.705 3.483 3.142 1.229-1.435 2.71-2.513 4.412-3.2A14.607 14.607 0 0162.784.21c2.917 0 5.14.762 6.628 2.277.162-.44.414-.89.814-1.275a2.756 2.756 0 011.789-.75c.231-.01.625-.013 1.167-.013s1.012.007 1.405.014l1.34.017c.327-.02.742-.031 1.256-.031.428 0 1.578 0 2.524.707a2.75 2.75 0 011.699-.621c.993-.01 2.92-.02 4.808.028.89.024 1.568.038 2.01.038 1.045 0 3.19 2.443 3.493 3.064V3.656a2.77 2.77 0 01-.282 2.895 464.532 464.532 0 01-4.791 6.199c.199.499.452 1.16.775 2.066.595 1.643 1.026 2.812 1.295 3.477l.16.406c.006.007.01.017.014.028.306.786.593 1.532.402 2.44-.12.569-.4 1.1-.806 1.525a2.75 2.75 0 01-1.979.846h-.162a21.33 21.33 0 00-.839-.02c-.214 0-.497.006-.846.02h-4.77c-.688 0-1.323-.26-1.813-.69-.963.801-2.224.801-2.862.801-.048 0-.09-.003-.131-.006h-.65l-3.908.02c-1.18 0-2.208-.61-2.747-1.587a2.525 2.525 0 01-.125-.236c-.006-.006-.02-.01-.03-.017-.594.413-1.233.77-1.92 1.061A13.674 13.674 0 0160.272 24c-4.17 0-7.27-2.51-8.754-4.427-.155.18-.31.354-.47.516l-.596.624c-.036.031-.07.066-.104.1-1.097 1.027-2.493 1.817-4.136 2.348-1.521.485-3.016.742-4.446.763h-.034c-2.593 0-4.702-.614-6.28-1.82a2.293 2.293 0 01-.117-.09c-.791 1.477-2.23 1.522-4.955 1.591-1.737.044-4.35.069-7.76.069-.322 0-.857-.006-1.6-.02-1.107-.021-2.035-.583-2.885-1.928-1.06.697-2.389 1.29-4.07 1.685-1.08.258-2.233.445-3.417.556a1.97 1.97 0 01-.252.014c-1.554 0-3.07-.233-4.502-.698-1.736-.555-5.082-4.15-5.368-4.992a5.72 5.72 0 01-.511-1.942c-.034-.523-.01-1.144.08-1.947a2.736 2.736 0 012.004-2.35c-.54-.976-.9-2.356-.507-4.207a9.006 9.006 0 011.34-3.207c.628-.928 1.374-1.712 2.216-2.316C7.296.78 9.94 0 13.02 0zm-.752 2.758C8.53 2.662 3.92 4.978 4.395 8.995c.305 2.594 3.05 3.511 4.657 3.875 1.607.364 2.873.848 2.703 1.929-.259 1.117-2.142 1.44-2.788.852-.423-.385-.438-1.02-.438-1.02-.014 0-5.683.007-5.704 0-.07.62-.031 1.193.054 1.526h-.003c.583 2.2 2.79 3.258 5.116 3.511 1.411.153 2.866.004 4.025-.36 3.29-.784 5.225-2.558 5.669-4.996.143-.785.137-2.168-.437-3.038-1.058-1.6-3.374-2.056-4.048-2.193-3.01-.608-3.039-1.126-2.97-1.53h.002c.08-.47.806-.946 1.74-.938.586.006 1.75.242 1.9 1.068h5.289c0-1.952-1.551-4.787-6.894-4.923zm50.524.217c-1.543 0-3.027.287-4.46.866-1.608.648-2.948 1.747-4.018 3.293-.34.485-.669 1.124-.99 1.904a21.082 21.082 0 00-.605 1.678c-.238 1.119-.348 2.138-.341 3.057h-.004c.011 1.442.317 2.642.922 3.602.994 1.567 2.814 2.35 5.455 2.35 3.96 0 6.308-1.661 7.721-3.63.906-1.262 1.232-2.798 1.233-2.8l-5.867-.021c-.373 1.243-1.075 2.362-2.245 2.152-1.064-.19-1.553-1.554-.637-4.637.495-1.667 1.369-3.69 2.77-3.69 1.166 0 .974 2.264.974 2.264h5.705s.39-1.31.125-2.88c-.086-.51-.868-3.508-5.738-3.508zM44.11 2.824c-1.537 0-3.038.332-4.508.995-1.467.67-4.598 2.523-5.627 7.132-.515 2.303-.4 5.728 1.633 7.443 1.05.887 2.63 1.255 4.612 1.255 1.167-.017 2.379-.23 3.642-.634 1.267-.409 2.303-.985 3.107-1.74l.61-.635c.863-.866 1.55-1.993 2.075-3.377.27-.71.498-1.48.677-2.33.186-.898.273-1.706.262-2.433 0-.184-.003-.364-.02-.534v-.001c-.076-.857-.566-3.057-2.473-4.212-1.096-.665-2.453-.93-3.99-.93zm24.38 16.564h6.326s1.423-6.1 1.599-6.659c.653 2.347 1.3 4.652 1.947 6.66.018 0 6.704.073 6.718 0 .003-.004-3.139-8.58-3.139-8.58h.001l5.79-7.59H81.26l-4.127 6.324h-.352l1.336-6.324h-6.004l-3.625 16.17zm-48.935-.01l.003.004h11.876l.904-4.49-5.862.039 2.579-11.763h-6.035l-3.465 16.21zM43.138 6.736c1.637 0 1.94 2.126 1.22 4.693-1.066 3.792-2.268 4.549-3.613 4.455-1.345-.093-1.742-1.88-.77-5.037.976-3.167 2.125-4.111 3.163-4.111z"
+        fill={color}
+      />
+    </Svg>
+  );
+});
+
+Icon.displayName = 'SlockText';
+
+export default Icon;
@@ -0,0 +1,21 @@
+import Avatar from './components/Avatar';
+import Combine from './components/Combine';
+import Mono from './components/Mono';
+import Text from './components/Text';
+import { COLOR_PRIMARY, TITLE } from './style';
+
+export type CompoundedIcon = typeof Mono & {
+  Avatar: typeof Avatar;
+  Combine: typeof Combine;
+  Text: typeof Text;
+  colorPrimary: string;
+  title: string;
+};
+
+const Icons = Mono as CompoundedIcon;
+Icons.Text = Text;
+Icons.Combine = Combine;
+Icons.Avatar = Avatar;
+Icons.colorPrimary = COLOR_PRIMARY;
+Icons.title = TITLE;
+export default Icons;
@@ -0,0 +1,9 @@
+export const TITLE = 'Slock';
+export const COMBINE_TEXT_MULTIPLE = 0.75;
+export const COMBINE_SPACE_MULTIPLE = 0.2;
+export const COLOR_PRIMARY = '#ffd440';
+
+// Avatar constants
+export const AVATAR_BACKGROUND = COLOR_PRIMARY;
+export const AVATAR_COLOR = '#fff';
+export const AVATAR_ICON_MULTIPLE = 0.75;
@@ -0,0 +1,22 @@
+import React, { memo } from 'react';
+
+import { RNIconAvatar, type RNIconAvatarProps } from '@/features';
+
+import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
+import Mono from './Mono';
+
+export type AvatarProps = Omit<RNIconAvatarProps, 'Icon'>;
+
+const Avatar = memo<AvatarProps>(({ background, ...rest }) => {
+  return (
+    <RNIconAvatar
+      Icon={Mono}
+      aria-label={TITLE}
+      background={background || AVATAR_BACKGROUND}
+      color={AVATAR_COLOR}
+      iconMultiple={AVATAR_ICON_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+export default Avatar;
@@ -0,0 +1,24 @@
+import React, { memo } from 'react';
+
+import { RNIconCombine, type RNIconCombineProps } from '@/features';
+
+import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
+import Mono from './Mono';
+import Text from './Text';
+
+export type CombineProps = Omit<RNIconCombineProps, 'Icon' | 'Text'>;
+
+const Combine = memo<CombineProps>(({ ...rest }) => {
+  return (
+    <RNIconCombine
+      Icon={Mono}
+      Text={Text}
+      aria-label={TITLE}
+      spaceMultiple={COMBINE_SPACE_MULTIPLE}
+      textMultiple={COMBINE_TEXT_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Combine;
@@ -0,0 +1,21 @@
+import Avatar from './components/Avatar';
+import Combine from './components/Combine';
+import Mono from './components/Mono';
+import Text from './components/Text';
+import { COLOR_PRIMARY, TITLE } from './style';
+
+export type CompoundedIcon = typeof Mono & {
+  Avatar: typeof Avatar;
+  Combine: typeof Combine;
+  Text: typeof Text;
+  colorPrimary: string;
+  title: string;
+};
+
+const Icons = Mono as CompoundedIcon;
+Icons.Text = Text;
+Icons.Combine = Combine;
+Icons.Avatar = Avatar;
+Icons.colorPrimary = COLOR_PRIMARY;
+Icons.title = TITLE;
+export default Icons;
@@ -0,0 +1,9 @@
+export const TITLE = 'WorldRouter';
+export const COMBINE_TEXT_MULTIPLE = 0.55;
+export const COMBINE_SPACE_MULTIPLE = 0.25;
+export const COLOR_PRIMARY = '#000';
+
+// Avatar constants
+export const AVATAR_BACKGROUND = COLOR_PRIMARY;
+export const AVATAR_COLOR = '#fff';
+export const AVATAR_ICON_MULTIPLE = 0.65;
@@ -1,84 +1,23 @@
 import React, { memo } from 'react';
-import { Defs, LinearGradient, Path, Stop, Svg } from 'react-native-svg';
+import { Path, Svg } from 'react-native-svg';

 import type { RNIconProps } from '@/features';
-import { useFillIds } from '@/hooks/useFillId';
-
-import { TITLE } from '../style';

 const Icon = memo<RNIconProps>(({ size = 24, style, ...rest }) => {
-  const [a, b, c, d] = useFillIds(TITLE, 4);
  return (
    <Svg height={size} style={style} viewBox="0 0 24 24" width={size} {...rest}>
      <Path
-        d="M12 24c6.627 0 12-5.373 12-12S18.627 0 12 0 0 5.373 0 12s5.373 12 12 12z"
-        fill={a.fill}
+        d="M7.063 1.664C5.198 3.338 4.395 6.67 5.782 8.568c1.47 2.014 4.79 1.745 6.953.113 2.434-1.84 6.033-1.793 7.23.953.91 2.207.067 4.927-2.113 6.483-4.302 3.097-10.577 2.52-13.472-1.444-2.86-3.915-1.35-9.696 2.683-13.011v.002z"
+        fill="#fff"
      />
      <Path
-        clipRule="evenodd"
-        d="M12 0c.518 0 1.028.033 1.528.096A6.188 6.188 0 0112.12 12.28l-.12.001c-2.99 0-5.242 2.179-5.554 5.11-.223 2.086.353 4.412 2.242 6.146C3.672 22.1 0 17.479 0 12 0 5.373 5.373 0 12 0z"
-        fill={b.fill}
-        fillRule="evenodd"
+        d="M12.007.647C5.384.647.015 5.734.015 12.007s5.369 11.36 11.992 11.36C18.631 23.366 24 18.28 24 12.006 24 5.732 18.631.647 12.007.647zm5.846 15.472C13.55 19.216 7.275 18.64 4.38 14.675 1.521 10.759 3.03 4.979 7.064 1.664 5.199 3.338 4.396 6.67 5.782 8.568c1.47 2.014 4.791 1.745 6.954.112 2.433-1.838 6.032-1.792 7.23.954.91 2.207.067 4.926-2.113 6.483v.002z"
+        fill="#00CC70"
      />
      <Path
-        clipRule="evenodd"
-        d="M5.286 5a2.438 2.438 0 01.682 3.38c-3.962 5.966-3.215 10.743 2.648 15.136C3.636 22.056 0 17.452 0 12c0-1.787.39-3.482 1.09-5.006.253-.435.525-.872.817-1.311A2.438 2.438 0 015.286 5z"
-        fill={c.fill}
-        fillRule="evenodd"
+        d="M14.801 14.904a.669.669 0 01-.536-.269l-1.02-1.37a.67.67 0 01.006-.806l1.02-1.328a.668.668 0 011.059.815l-.712.925.72.963a.67.67 0 01-.535 1.066l-.002.004zm-3.931-2.001c0 1.797-.356 2.135-1.16 2.135-.806 0-1.162-.338-1.162-2.135 0-1.796.357-2.134 1.161-2.134.805 0 1.162.338 1.162 2.134h-.001z"
+        fill="#1C1C1C"
      />
-      <Path
-        clipRule="evenodd"
-        d="M12.98.04c.272.021.543.053.81.093.583.106 1.117.254 1.538.44 6.638 2.927 8.07 10.052 1.748 15.642a4.126 4.126 0 01-5.822-.358c-1.51-1.706-1.3-4.184.357-5.822.858-.848 3.108-1.223 4.045-2.44 1.257-1.635 2.122-6.01-2.523-7.507L12.98.04z"
-        fill={d.fill}
-        fillRule="evenodd"
-      />
-      <Path
-        clipRule="evenodd"
-        d="M13.528.096A6.187 6.187 0 0112 12.281a5.752 5.752 0 00-1.71.255c.147-.905.595-1.784 1.321-2.501.858-.848 3.108-1.223 4.045-2.441 1.27-1.651 2.14-6.104-2.676-7.554.184.014.367.033.548.056z"
-        fill="#ECECEE"
-        fillRule="evenodd"
-      />
-      <Defs>
-        <LinearGradient gradientUnits="userSpaceOnUse" id={a.id} x1="12" x2="12" y1="0" y2="24">
-          <Stop stopColor="#02B2FC" />
-          <Stop offset="5%" stopColor="#20CBB6" />
-          <Stop offset="100%" stopColor="#13D363" />
-        </LinearGradient>
-        <LinearGradient
-          gradientUnits="userSpaceOnUse"
-          id={b.id}
-          x1="9.095"
-          x2="9.095"
-          y1="0"
-          y2="23.537"
-        >
-          <Stop stopColor="#C3EBEF" />
-          <Stop offset="100%" stopColor="#D3F4DD" />
-        </LinearGradient>
-        <LinearGradient
-          gradientUnits="userSpaceOnUse"
-          id={c.id}
-          x1="4.308"
-          x2="4.308"
-          y1="4.593"
-          y2="23.516"
-        >
-          <Stop stopColor="#14D368" />
-          <Stop offset="5%" stopColor="#24CEAD" />
-          <Stop offset="100%" stopColor="#03B4F8" />
-        </LinearGradient>
-        <LinearGradient
-          gradientUnits="userSpaceOnUse"
-          id={d.id}
-          x1="15.685"
-          x2="15.685"
-          y1=".039"
-          y2="17.249"
-        >
-          <Stop stopColor="#61CFFA" stopOpacity=".996" />
-          <Stop offset="100%" stopColor="#79E3C0" />
-        </LinearGradient>
-      </Defs>
    </Svg>
  );
 });
@@ -15,7 +15,11 @@ const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }
      {...rest}
    >
      <Path
-        d="M12 0c6.627 0 12 5.373 12 12s-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0zm1.652 1.123l-.01-.001c.533.097 1.023.233 1.41.404 6.084 2.683 7.396 9.214 1.601 14.338a3.781 3.781 0 01-5.337-.328 3.654 3.654 0 01-.884-3.044c-1.934.6-3.295 2.305-3.524 4.45-.204 1.912.324 4.044 2.056 5.634l.245.067C10.1 22.876 11.036 23 12 23c6.075 0 11-4.925 11-11 0-5.513-4.056-10.08-9.348-10.877zM2.748 6.21c-.178.269-.348.536-.51.803l-.235.394.078-.167A10.957 10.957 0 001 12c0 4.919 3.228 9.083 7.682 10.49l.214.065C3.523 18.528 2.84 14.149 6.47 8.68A2.234 2.234 0 102.748 6.21zm10.157-5.172c4.408 1.33 3.61 5.41 2.447 6.924-.86 1.117-2.922 1.46-3.708 2.238-.666.657-1.077 1.462-1.212 2.291A5.303 5.303 0 0112 12.258a5.672 5.672 0 001.404-11.169 10.51 10.51 0 00-.5-.052z"
+        d="M12.014.648c-6.628 0-12 5.09-12 11.367 0 6.277 5.372 11.366 12 11.366s12-5.09 12-11.366c0-6.277-5.372-11.367-12-11.367zm5.849 15.481c-4.305 3.1-10.584 2.523-13.481-1.444-2.86-3.918-1.351-9.703 2.685-13.02-1.866 1.676-2.67 5.01-1.282 6.909 1.471 2.015 4.794 1.746 6.958.113 2.435-1.84 6.036-1.794 7.234.954.91 2.208.067 4.93-2.114 6.487v.001z"
+        fill={color}
+      />
+      <Path
+        d="M14.81 14.914a.669.669 0 01-.536-.269l-1.02-1.37a.67.67 0 01.005-.807l1.021-1.328a.669.669 0 011.06.814l-.713.926.72.964a.67.67 0 01-.534 1.067l-.002.003zM10.877 12.913c0 1.797-.357 2.135-1.162 2.135-.805 0-1.162-.338-1.162-2.135 0-1.798.357-2.136 1.162-2.136.805 0 1.162.338 1.162 2.136z"
        fill={color}
      />
    </Svg>
@@ -21,6 +21,7 @@ export { default as Ai360, type CompoundedIcon as Ai360Props } from './icons/Ai3
 export { default as AiHubMix, type CompoundedIcon as AiHubMixProps } from './icons/AiHubMix';
 export { default as AiMass, type CompoundedIcon as AiMassProps } from './icons/AiMass';
 export { default as AionLabs, type CompoundedIcon as AionLabsProps } from './icons/AionLabs';
+export { default as AirJelly, type CompoundedIcon as AirJellyProps } from './icons/AirJelly';
 export { default as AiStudio, type CompoundedIcon as AiStudioProps } from './icons/AiStudio';
 export { default as AkashChat, type CompoundedIcon as AkashChatProps } from './icons/AkashChat';
 export { default as AlephAlpha, type CompoundedIcon as AlephAlphaProps } from './icons/AlephAlpha';
@@ -109,6 +110,7 @@ export { default as DeepInfra, type CompoundedIcon as DeepInfraProps } from './i
 export { default as DeepL, type CompoundedIcon as DeepLProps } from './icons/DeepL';
 export { default as DeepMind, type CompoundedIcon as DeepMindProps } from './icons/DeepMind';
 export { default as DeepSeek, type CompoundedIcon as DeepSeekProps } from './icons/DeepSeek';
+export { default as Devin, type CompoundedIcon as DevinProps } from './icons/Devin';
 export { default as Dify, type CompoundedIcon as DifyProps } from './icons/Dify';
 export { default as Doc2X, type CompoundedIcon as Doc2XProps } from './icons/Doc2X';
 export { default as DocSearch, type CompoundedIcon as DocSearchProps } from './icons/DocSearch';
@@ -199,6 +201,7 @@ export { default as Jina, type CompoundedIcon as JinaProps } from './icons/Jina'
 export { default as Junie, type CompoundedIcon as JunieProps } from './icons/Junie';
 export { default as KiloCode, type CompoundedIcon as KiloCodeProps } from './icons/KiloCode';
 export { default as Kimi, type CompoundedIcon as KimiProps } from './icons/Kimi';
+export { default as Kiro, type CompoundedIcon as KiroProps } from './icons/Kiro';
 export { default as Kling, type CompoundedIcon as KlingProps } from './icons/Kling';
 export { default as Kluster, type CompoundedIcon as KlusterProps } from './icons/Kluster';
 export { default as Kolors, type CompoundedIcon as KolorsProps } from './icons/Kolors';
@@ -243,6 +246,7 @@ export { default as ModelScope, type CompoundedIcon as ModelScopeProps } from '.
 export { default as Monica, type CompoundedIcon as MonicaProps } from './icons/Monica';
 export { default as Moonshot, type CompoundedIcon as MoonshotProps } from './icons/Moonshot';
 export { default as Morph, type CompoundedIcon as MorphProps } from './icons/Morph';
+export { default as Moxt, type CompoundedIcon as MoxtProps } from './icons/Moxt';
 export { default as MyShell, type CompoundedIcon as MyShellProps } from './icons/MyShell';
 export { default as N8n, type CompoundedIcon as N8nProps } from './icons/N8n';
 export { default as NanoBanana, type CompoundedIcon as NanoBananaProps } from './icons/NanoBanana';
@@ -266,6 +270,7 @@ export { default as OpenChat, type CompoundedIcon as OpenChatProps } from './ico
 export { default as OpenClaw, type CompoundedIcon as OpenClawProps } from './icons/OpenClaw';
 export { default as OpenCode, type CompoundedIcon as OpenCodeProps } from './icons/OpenCode';
 export { default as OpenHands, type CompoundedIcon as OpenHandsProps } from './icons/OpenHands';
+export { default as OpenHuman, type CompoundedIcon as OpenHumanProps } from './icons/OpenHuman';
 export { default as OpenRouter, type CompoundedIcon as OpenRouterProps } from './icons/OpenRouter';
 export { default as OpenWebUI, type CompoundedIcon as OpenWebUIProps } from './icons/OpenWebUI';
 export { default as PaLM, type CompoundedIcon as PaLMProps } from './icons/PaLM';
@@ -306,7 +311,12 @@ export {
  default as SiliconCloud,
  type CompoundedIcon as SiliconCloudProps,
 } from './icons/SiliconCloud';
+export {
+  default as SillyTavern,
+  type CompoundedIcon as SillyTavernProps,
+} from './icons/SillyTavern';
 export { default as Skywork, type CompoundedIcon as SkyworkProps } from './icons/Skywork';
+export { default as Slock, type CompoundedIcon as SlockProps } from './icons/Slock';
 export { default as Smithery, type CompoundedIcon as SmitheryProps } from './icons/Smithery';
 export { default as Snowflake, type CompoundedIcon as SnowflakeProps } from './icons/Snowflake';
 export { default as SophNet, type CompoundedIcon as SophNetProps } from './icons/SophNet';
@@ -357,6 +367,10 @@ export { default as Voyage, type CompoundedIcon as VoyageProps } from './icons/V
 export { default as Wenxin, type CompoundedIcon as WenxinProps } from './icons/Wenxin';
 export { default as Windsurf, type CompoundedIcon as WindsurfProps } from './icons/Windsurf';
 export { default as WorkersAI, type CompoundedIcon as WorkersAIProps } from './icons/WorkersAI';
+export {
+  default as WorldRouter,
+  type CompoundedIcon as WorldRouterProps,
+} from './icons/WorldRouter';
 export { default as XAI, type CompoundedIcon as XAIProps } from './icons/XAI';
 export { default as XiaomiMiMo, type CompoundedIcon as XiaomiMiMoProps } from './icons/XiaomiMiMo';
 export { default as Xinference, type CompoundedIcon as XinferenceProps } from './icons/Xinference';
@@ -0,0 +1,25 @@
+'use client';
+
+import { memo } from 'react';
+
+import IconAvatar, { type IconAvatarProps } from '@/features/IconAvatar';
+
+import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
+import Mono from './Mono';
+
+export type AvatarProps = Omit<IconAvatarProps, 'Icon'>;
+
+const Avatar = memo<AvatarProps>(({ ...rest }) => {
+  return (
+    <IconAvatar
+      Icon={Mono}
+      aria-label={TITLE}
+      background={AVATAR_BACKGROUND}
+      color={AVATAR_COLOR}
+      iconMultiple={AVATAR_ICON_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Avatar;
@@ -0,0 +1,28 @@
+'use client';
+
+import { memo } from 'react';
+
+import type { IconType } from '@/types';
+
+import { TITLE } from '../style';
+
+const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
+  return (
+    <svg
+      height={size}
+      style={{ flex: 'none', lineHeight: 1, ...style }}
+      viewBox="0 0 24 24"
+      width={size}
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <title>{TITLE}</title>
+      <path
+        d="M16.962 13.071c1.667-.022 2.832 8.685 1.297 9.21-1.992.68-1.278-7.563-1.275-7.6 0 0-3.58 9.553-6.135 8.909-2.46-.62 4.445-10.495 6.113-10.519zM3.5 20.471C1.246 17.29 12.668 9.25 16.83 9.812c4.162.563 6.387 8.328 4.83 8.91-1.556.58-2.597-6.608-4.83-6.608-2.354 0-11.076 11.54-13.33 8.357zM1.747 7.711c3.402-5.183 12.01-8.536 17.276-5.183 5.266 3.354 5.529 10.13 4.74 11.087-.87 1.057-1.637-.882-3.666-3.173-4.411-4.977-11.94 1.396-15.9 3.505-2.481 1.322-6.33-.323-2.45-6.235z"
+        fill="#00C8FF"
+      />
+    </svg>
+  );
+});
+
+export default Icon;
@@ -0,0 +1,30 @@
+'use client';
+
+import { memo } from 'react';
+
+import IconCombine, { type IconCombineProps } from '@/features/IconCombine';
+
+import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
+import Color from './Color';
+import Mono from './Mono';
+import Text from './Text';
+
+export interface CombineProps extends Omit<IconCombineProps, 'Icon' | 'Text'> {
+  type?: 'color' | 'mono';
+}
+const Combine = memo<CombineProps>(({ type = 'mono', ...rest }) => {
+  const Icon = type === 'color' ? Color : Mono;
+
+  return (
+    <IconCombine
+      Icon={Icon}
+      Text={Text}
+      aria-label={TITLE}
+      spaceMultiple={COMBINE_SPACE_MULTIPLE}
+      textMultiple={COMBINE_TEXT_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Combine;
@@ -0,0 +1,27 @@
+'use client';
+
+import { memo } from 'react';
+
+import type { IconType } from '@/types';
+
+import { TITLE } from '../style';
+
+const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
+  return (
+    <svg
+      fill="currentColor"
+      fillRule="evenodd"
+      height={size}
+      style={{ flex: 'none', lineHeight: 1, ...style }}
+      viewBox="0 0 24 24"
+      width={size}
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <title>{TITLE}</title>
+      <path d="M16.962 13.071c1.667-.022 2.832 8.685 1.297 9.21-1.992.68-1.278-7.563-1.275-7.6 0 0-3.58 9.553-6.135 8.909-2.46-.62 4.445-10.495 6.113-10.519zM3.5 20.471C1.246 17.29 12.668 9.25 16.83 9.812c4.162.563 6.387 8.328 4.83 8.91-1.556.58-2.597-6.608-4.83-6.608-2.354 0-11.076 11.54-13.33 8.357zM1.747 7.711c3.402-5.183 12.01-8.536 17.276-5.183 5.266 3.354 5.529 10.13 4.74 11.087-.87 1.057-1.637-.882-3.666-3.173-4.411-4.977-11.94 1.396-15.9 3.505-2.481 1.322-6.33-.323-2.45-6.235z" />
+    </svg>
+  );
+});
+
+export default Icon;
@@ -0,0 +1,26 @@
+'use client';
+
+import { memo } from 'react';
+
+import type { IconType } from '@/types';
+
+import { TITLE } from '../style';
+
+const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
+  return (
+    <svg
+      fill="currentColor"
+      fillRule="evenodd"
+      height={size}
+      style={{ flex: 'none', lineHeight: 1, ...style }}
+      viewBox="0 0 81 24"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <title>{TITLE}</title>
+      <path d="M72.394 8.772c.225 0 .338.12.338.36 0 .298-.254.545-.763.743l-.933.36 2.354 5.727c.056.127.092.297.106.509.014.198.022.325.022.381h.105c0-.07.007-.205.021-.403.029-.198.071-.36.127-.487l2.44-5.748h-1.146c-.325 0-.487-.198-.487-.594 0-.283.1-.494.297-.636.198-.141.466-.212.806-.212h3.605c.226 0 .34.12.34.36 0 .156-.072.29-.213.403-.127.113-.31.227-.55.34l-.828.36-3.987 9.354c-.608 1.414-1.266 2.502-1.973 3.266-.693.763-1.527 1.145-2.503 1.145-.396 0-.728-.114-.997-.34-.268-.212-.402-.502-.402-.869 0-.297.084-.573.254-.827.933 0 1.668-.148 2.206-.445.551-.283 1.011-.835 1.379-1.655l.275-.678-3.817-8.972h-.807c-.325 0-.487-.198-.487-.594 0-.283.099-.494.297-.636.198-.141.466-.212.805-.212h4.116zM41.245 4.445c.24 0 .36.121.36.362a.635.635 0 01-.19.465c-.128.128-.332.249-.615.362l-.892.339v7.847c0 1.357-.268 2.453-.806 3.287-.523.835-1.18 1.47-1.972 1.909-.58.31-1.16.466-1.74.466-.423 0-.77-.14-1.038-.423-.27-.283-.417-.736-.446-1.358.806-.283 1.45-.587 1.93-.912.48-.325.834-.736 1.06-1.23.24-.51.362-1.145.362-1.909V5.973H35.9a.509.509 0 01-.403-.17c-.085-.113-.127-.27-.127-.467 0-.297.106-.516.318-.657.212-.156.495-.234.848-.234h4.71zm7.076 4.115c.933 0 1.753.184 2.46.551.721.368 1.28.891 1.676 1.57.41.678.615 1.47.615 2.375 0 .254-.036.537-.106.848a3.16 3.16 0 01-.276.784h-7.062c0 1.075.297 1.888.89 2.44.608.551 1.337.827 2.185.827.495 0 .926-.057 1.294-.17a7.109 7.109 0 001.273-.594c.056-.028.148-.077.275-.148.141-.085.255-.127.34-.127.183 0 .338.07.466.212a.764.764 0 01.191.53.816.816 0 01-.191.53c-.128.156-.332.318-.615.488-.933.537-1.987.806-3.16.806-1.033 0-1.966-.205-2.8-.615a4.666 4.666 0 01-1.952-1.824c-.466-.806-.699-1.782-.699-2.927 0-1.16.219-2.156.657-2.99.453-.834 1.068-1.47 1.846-1.91.792-.437 1.69-.656 2.693-.656zm-33.068 9.098l.806.277c.282.099.488.211.615.338a.568.568 0 01.191.446c0 .31-.106.466-.318.466h-5.303c-.34 0-.509-.211-.509-.635 0-.297.107-.517.319-.658.212-.156.494-.234.847-.234h.68l-1.082-2.905H5.581l-1.06 2.905 1.167.361c.324.1.551.205.678.318.127.113.19.262.19.446 0 .268-.106.402-.318.402H1.53a.509.509 0 01-.403-.17C1.042 18.904 1 18.748 1 18.55c0-.297.106-.517.318-.658.212-.156.496-.234.849-.234h.36l4.92-13.213h2.885l4.92 13.213zm6.342.086l.848.339c.283.127.481.247.594.36a.484.484 0 01.17.382c0 .24-.107.36-.318.36h-4.751c-.326 0-.489-.197-.489-.593 0-.566.375-.848 1.124-.848h.34v-7.53h-.975c-.325 0-.489-.197-.489-.593 0-.283.1-.495.297-.637.198-.141.474-.212.827-.212h2.822v8.972zm36.749 0l.848.339c.283.127.481.247.594.36a.484.484 0 01.17.382c-.001.24-.107.36-.318.36h-4.752c-.325 0-.488-.197-.488-.593 0-.566.375-.849 1.124-.849h.34V5.57h-.976c-.325 0-.488-.198-.488-.593 0-.283.1-.495.297-.636.198-.142.474-.213.828-.213h2.82v13.616zm6.98 0l.848.339c.282.127.48.247.594.36.113.1.17.227.17.382 0 .24-.107.36-.319.36h-4.75c-.326 0-.489-.197-.49-.593 0-.566.377-.849 1.126-.849h.339V5.57h-.976c-.325 0-.488-.198-.488-.593 0-.283.1-.495.297-.636.198-.142.474-.213.828-.213h2.82v13.616zM31.85 8.56c.41 0 .727.112.954.338.226.227.339.517.339.87 0 .212-.043.424-.127.636-.071.198-.17.361-.297.489-1.626 0-3.104.537-4.433 1.61v5.24l.849.339c.282.127.48.247.594.36a.484.484 0 01.168.382c0 .24-.105.36-.317.36h-4.75c-.326 0-.49-.197-.49-.593.001-.565.376-.848 1.125-.848h.34v-7.53h-.976c-.325 0-.488-.197-.488-.593 0-.283.099-.495.297-.637.198-.141.474-.211.827-.212h2.715v2.143h.063a7.8 7.8 0 011.74-1.676c.65-.452 1.273-.678 1.867-.678zM48.3 10.087c-.735 0-1.35.276-1.845.827-.495.552-.77 1.3-.827 2.248h4.856c.071-.184.107-.396.107-.637 0-.763-.206-1.357-.615-1.78-.41-.44-.97-.658-1.676-.658zm-42.104 2.97h4.666L8.551 6.673l-2.355 6.384zM20.301 4c.466 0 .855.15 1.166.446.325.297.488.693.488 1.188s-.163.89-.488 1.187c-.311.297-.7.446-1.166.446-.467 0-.856-.149-1.167-.446-.311-.297-.466-.693-.466-1.187 0-.495.155-.89.466-1.188.31-.297.7-.446 1.167-.446z" />
+    </svg>
+  );
+});
+
+export default Icon;
@@ -0,0 +1,72 @@
+---
+nav: Components
+group: Application
+title: AirJelly
+atomId: AirJelly
+description: https://airjelly.ai
+---
+
+## Icons
+
+```tsx
+import { AirJelly } from '@lobehub/icons';
+import { Flexbox } from '@lobehub/ui';
+
+export default () => (
+  <Flexbox gap={16} horizontal>
+    <AirJelly size={64} />
+    <AirJelly.Color size={64} />
+  </Flexbox>
+);
+```
+
+## Text
+
+```tsx
+import { AirJelly } from '@lobehub/icons';
+
+export default () => <AirJelly.Text size={48} />;
+```
+
+## Combine
+
+```tsx
+import { AirJelly } from '@lobehub/icons';
+import { Flexbox } from '@lobehub/ui';
+
+export default () => (
+  <Flexbox gap={16} align={'flex-start'}>
+    <AirJelly.Combine size={64} />
+    <AirJelly.Combine size={64} type={'color'} />
+  </Flexbox>
+);
+```
+
+## Avatars
+
+```tsx
+import { AirJelly } from '@lobehub/icons';
+import { Flexbox } from '@lobehub/ui';
+
+export default () => (
+  <Flexbox gap={16} horizontal>
+    <AirJelly.Avatar size={64} />
+    <AirJelly.Avatar size={64} shape={'square'} />
+  </Flexbox>
+);
+```
+
+## Colors
+
+```tsx
+import { AirJelly } from '@lobehub/icons';
+import { Flexbox } from '@lobehub/ui';
+
+import ColorPreview from '../components/ColorPreview';
+
+export default () => (
+  <Flexbox gap={16} horizontal>
+    <ColorPreview color={AirJelly.colorPrimary} />
+  </Flexbox>
+);
+```
@@ -0,0 +1,25 @@
+import Avatar from './components/Avatar';
+import Color from './components/Color';
+import Combine from './components/Combine';
+import Mono from './components/Mono';
+import Text from './components/Text';
+import { COLOR_PRIMARY, TITLE } from './style';
+
+export type CompoundedIcon = typeof Mono & {
+  Avatar: typeof Avatar;
+  Color: typeof Color;
+  Combine: typeof Combine;
+  Text: typeof Text;
+  colorPrimary: string;
+  title: string;
+};
+
+const Icons = Mono as CompoundedIcon;
+Icons.Color = Color;
+Icons.Text = Text;
+Icons.Combine = Combine;
+Icons.Avatar = Avatar;
+Icons.colorPrimary = COLOR_PRIMARY;
+Icons.title = TITLE;
+
+export default Icons;
@@ -0,0 +1,9 @@
+export const TITLE = 'AirJelly';
+export const COMBINE_TEXT_MULTIPLE = 0.85;
+export const COMBINE_SPACE_MULTIPLE = 0.2;
+export const COLOR_PRIMARY = '#00C8FF';
+
+// Avatar constants
+export const AVATAR_BACKGROUND = COLOR_PRIMARY;
+export const AVATAR_COLOR = '#fff';
+export const AVATAR_ICON_MULTIPLE = 0.75;
@@ -0,0 +1,25 @@
+'use client';
+
+import { memo } from 'react';
+
+import IconAvatar, { type IconAvatarProps } from '@/features/IconAvatar';
+
+import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
+import Color from './Color';
+
+export type AvatarProps = Omit<IconAvatarProps, 'Icon'>;
+
+const Avatar = memo<AvatarProps>(({ ...rest }) => {
+  return (
+    <IconAvatar
+      Icon={Color}
+      aria-label={TITLE}
+      background={AVATAR_BACKGROUND}
+      color={AVATAR_COLOR}
+      iconMultiple={AVATAR_ICON_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Avatar;
@@ -0,0 +1,36 @@
+'use client';
+
+import { memo } from 'react';
+
+import type { IconType } from '@/types';
+
+import { TITLE } from '../style';
+
+const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
+  return (
+    <svg
+      height={size}
+      style={{ flex: 'none', lineHeight: 1, ...style }}
+      viewBox="0 0 24 24"
+      width={size}
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <title>{TITLE}</title>
+      <path
+        d="M2.033 9.867l2.554 1.483a.589.589 0 00.592 0l2.554-1.483.01-.008a.608.608 0 00.11-.084l.013-.015a.631.631 0 00.076-.1c.003-.005.008-.01.01-.016a.558.558 0 00.052-.125l.007-.028a.611.611 0 00.019-.14V7.868c0-.572.307-1.105.8-1.392a1.595 1.595 0 011.598 0l1.277.742a.54.54 0 00.129.053l.028.01c.044.01.088.015.133.016h.006l.013-.002a.587.587 0 00.27-.074l.011-.004 2.554-1.483a.596.596 0 00.297-.516V2.253a.595.595 0 00-.297-.516L12.293.257a.587.587 0 00-.591 0L9.148 1.737l-.01.01a.609.609 0 00-.109.083l-.014.015a.632.632 0 00-.076.1c-.003.005-.008.01-.01.016a.57.57 0 00-.052.124l-.007.028a.612.612 0 00-.018.14v1.483c0 .572-.307 1.105-.8 1.393a1.597 1.597 0 01-1.599 0l-1.276-.742a.603.603 0 00-.13-.053l-.028-.008a.658.658 0 00-.133-.018h-.02a.57.57 0 00-.269.074c-.003.002-.008.002-.012.005L2.033 5.872a.596.596 0 00-.297.515v2.966c0 .213.113.41.297.515z"
+        fill="#3969CA"
+      />
+      <path
+        d="M15.943 10.607a1.596 1.596 0 011.599 0l1.276.74c.041.025.085.04.13.055l.028.008c.043.01.088.016.133.018h.005c.005 0 .01-.002.014-.003a.474.474 0 00.122-.016l.021-.005a.616.616 0 00.126-.052c.004-.002.009-.002.013-.005l2.554-1.482a.597.597 0 00.297-.516V6.383a.596.596 0 00-.297-.515l-2.552-1.483a.587.587 0 00-.592 0l-2.553 1.482-.011.008a.61.61 0 00-.108.084l-.014.016a.637.637 0 00-.076.1c-.003.005-.008.01-.01.016a.57.57 0 00-.052.124l-.007.029a.612.612 0 00-.018.14v1.482c0 .572-.307 1.105-.8 1.393a1.597 1.597 0 01-1.599 0l-1.276-.742a.584.584 0 00-.13-.053l-.028-.008a.62.62 0 00-.133-.018h-.02a.587.587 0 00-.269.074l-.012.004L9.15 10a.596.596 0 00-.296.516v2.966c0 .212.112.409.296.515l2.554 1.483s.008.002.012.005c.04.022.082.04.126.052l.02.004a.57.57 0 00.123.017l.014.002h.006c.054 0 .108-.01.16-.025a.587.587 0 00.13-.054l1.277-.741a1.597 1.597 0 012.398 1.392v1.482c0 .049.007.095.019.14l.007.028a.619.619 0 00.051.125c.004.006.008.01.01.016a.6.6 0 00.076.1l.014.015c.033.032.069.06.108.084.004.002.006.006.011.008l2.554 1.483a.59.59 0 00.593 0l2.554-1.483a.597.597 0 00.296-.516v-2.965a.595.595 0 00-.296-.516l-2.554-1.483s-.008-.002-.012-.005a.54.54 0 00-.126-.051c-.007-.003-.013-.003-.02-.005a.635.635 0 00-.125-.017h-.018a.557.557 0 00-.16.026.588.588 0 00-.13.053l-1.276.742a1.595 1.595 0 01-1.598 0 1.615 1.615 0 010-2.785l-.005-.001z"
+        fill="#21C19A"
+      />
+      <path
+        d="M14.848 18.265l-2.554-1.482-.012-.005a.526.526 0 00-.126-.052c-.007-.002-.014-.002-.02-.005a.64.64 0 00-.124-.017h-.02a.56.56 0 00-.16.026.588.588 0 00-.13.053l-1.276.742a1.594 1.594 0 01-1.598 0c-.493-.286-.8-.82-.8-1.393V14.65a.563.563 0 00-.018-.14l-.008-.028a.604.604 0 00-.051-.124l-.01-.017a.603.603 0 00-.076-.1l-.014-.015a.596.596 0 00-.109-.084c-.003-.002-.005-.006-.01-.008L5.178 12.65a.587.587 0 00-.591 0l-2.554 1.483a.596.596 0 00-.297.516v2.965c0 .213.113.41.297.516l2.554 1.483.012.004a.618.618 0 00.267.074l.016.002h.007a.55.55 0 00.16-.026.584.584 0 00.129-.053l1.277-.742a1.597 1.597 0 012.398 1.393v1.482c0 .05.007.095.019.14l.007.028c.013.044.03.085.051.125l.01.016c.022.036.047.07.076.1l.014.015c.032.032.069.06.109.084l.01.008 2.554 1.483a.587.587 0 00.593 0l2.554-1.483a.596.596 0 00.296-.515v-2.966a.596.596 0 00-.296-.516h-.002z"
+        fill="#0294DE"
+      />
+    </svg>
+  );
+});
+
+export default Icon;
@@ -0,0 +1,30 @@
+'use client';
+
+import { memo } from 'react';
+
+import IconCombine, { type IconCombineProps } from '@/features/IconCombine';
+
+import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
+import Color from './Color';
+import Mono from './Mono';
+import Text from './Text';
+
+export interface CombineProps extends Omit<IconCombineProps, 'Icon' | 'Text'> {
+  type?: 'color' | 'mono';
+}
+const Combine = memo<CombineProps>(({ type = 'mono', ...rest }) => {
+  const Icon = type === 'color' ? Color : Mono;
+
+  return (
+    <IconCombine
+      Icon={Icon}
+      Text={Text}
+      aria-label={TITLE}
+      spaceMultiple={COMBINE_SPACE_MULTIPLE}
+      textMultiple={COMBINE_TEXT_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Combine;
@@ -0,0 +1,29 @@
+'use client';
+
+import { memo } from 'react';
+
+import type { IconType } from '@/types';
+
+import { TITLE } from '../style';
+
+const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
+  return (
+    <svg
+      fill="currentColor"
+      fillRule="evenodd"
+      height={size}
+      style={{ flex: 'none', lineHeight: 1, ...style }}
+      viewBox="0 0 24 24"
+      width={size}
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <title>{TITLE}</title>
+      <path d="M2.033 9.867l2.554 1.483a.589.589 0 00.592 0l2.554-1.483.01-.008a.608.608 0 00.11-.084l.013-.015a.631.631 0 00.076-.1c.003-.005.008-.01.01-.016a.558.558 0 00.052-.125l.007-.028a.611.611 0 00.019-.14V7.868c0-.572.307-1.105.8-1.392a1.595 1.595 0 011.598 0l1.277.742a.54.54 0 00.129.053l.028.01c.044.01.088.015.133.016h.006l.013-.002a.587.587 0 00.27-.074l.011-.004 2.554-1.483a.596.596 0 00.297-.516V2.253a.595.595 0 00-.297-.516L12.293.257a.587.587 0 00-.591 0L9.148 1.737l-.01.01a.609.609 0 00-.109.083l-.014.015a.632.632 0 00-.076.1c-.003.005-.008.01-.01.016a.57.57 0 00-.052.124l-.007.028a.612.612 0 00-.018.14v1.483c0 .572-.307 1.105-.8 1.393a1.597 1.597 0 01-1.599 0l-1.276-.742a.603.603 0 00-.13-.053l-.028-.008a.658.658 0 00-.133-.018h-.02a.57.57 0 00-.269.074c-.003.002-.008.002-.012.005L2.033 5.872a.596.596 0 00-.297.515v2.966c0 .213.113.41.297.515z" />
+      <path d="M15.943 10.607a1.596 1.596 0 011.599 0l1.276.74c.041.025.085.04.13.055l.028.008c.043.01.088.016.133.018h.005c.005 0 .01-.002.014-.003a.474.474 0 00.122-.016l.021-.005a.616.616 0 00.126-.052c.004-.002.009-.002.013-.005l2.554-1.482a.597.597 0 00.297-.516V6.383a.596.596 0 00-.297-.515l-2.552-1.483a.587.587 0 00-.592 0l-2.553 1.482-.011.008a.61.61 0 00-.108.084l-.014.016a.637.637 0 00-.076.1c-.003.005-.008.01-.01.016a.57.57 0 00-.052.124l-.007.029a.612.612 0 00-.018.14v1.482c0 .572-.307 1.105-.8 1.393a1.597 1.597 0 01-1.599 0l-1.276-.742a.584.584 0 00-.13-.053l-.028-.008a.62.62 0 00-.133-.018h-.02a.587.587 0 00-.269.074l-.012.004L9.15 10a.596.596 0 00-.296.516v2.966c0 .212.112.409.296.515l2.554 1.483s.008.002.012.005c.04.022.082.04.126.052l.02.004a.57.57 0 00.123.017l.014.002h.006c.054 0 .108-.01.16-.025a.587.587 0 00.13-.054l1.277-.741a1.597 1.597 0 012.398 1.392v1.482c0 .049.007.095.019.14l.007.028a.619.619 0 00.051.125c.004.006.008.01.01.016a.6.6 0 00.076.1l.014.015c.033.032.069.06.108.084.004.002.006.006.011.008l2.554 1.483a.59.59 0 00.593 0l2.554-1.483a.597.597 0 00.296-.516v-2.965a.595.595 0 00-.296-.516l-2.554-1.483s-.008-.002-.012-.005a.54.54 0 00-.126-.051c-.007-.003-.013-.003-.02-.005a.635.635 0 00-.125-.017h-.018a.557.557 0 00-.16.026.588.588 0 00-.13.053l-1.276.742a1.595 1.595 0 01-1.598 0 1.615 1.615 0 010-2.785l-.005-.001z" />
+      <path d="M14.848 18.265l-2.554-1.482-.012-.005a.526.526 0 00-.126-.052c-.007-.002-.014-.002-.02-.005a.64.64 0 00-.124-.017h-.02a.56.56 0 00-.16.026.588.588 0 00-.13.053l-1.276.742a1.594 1.594 0 01-1.598 0c-.493-.286-.8-.82-.8-1.393V14.65a.563.563 0 00-.018-.14l-.008-.028a.604.604 0 00-.051-.124l-.01-.017a.603.603 0 00-.076-.1l-.014-.015a.596.596 0 00-.109-.084c-.003-.002-.005-.006-.01-.008L5.178 12.65a.587.587 0 00-.591 0l-2.554 1.483a.596.596 0 00-.297.516v2.965c0 .213.113.41.297.516l2.554 1.483.012.004a.618.618 0 00.267.074l.016.002h.007a.55.55 0 00.16-.026.584.584 0 00.129-.053l1.277-.742a1.597 1.597 0 012.398 1.393v1.482c0 .05.007.095.019.14l.007.028c.013.044.03.085.051.125l.01.016c.022.036.047.07.076.1l.014.015c.032.032.069.06.109.084l.01.008 2.554 1.483a.587.587 0 00.593 0l2.554-1.483a.596.596 0 00.296-.515v-2.966a.596.596 0 00-.296-.516h-.002z" />
+    </svg>
+  );
+});
+
+export default Icon;
@@ -0,0 +1,25 @@
+'use client';
+
+import { memo } from 'react';
+
+import type { IconType } from '@/types';
+
+import { TITLE } from '../style';
+
+const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
+  return (
+    <svg
+      fill="currentColor"
+      height={size}
+      style={{ flex: 'none', lineHeight: 1, ...style }}
+      viewBox="0 0 80 24"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <title>{TITLE}</title>
+      <path d="M69.069 13.524v10.135h-3.325V6.589h3.191v2.779h.211a4.88 4.88 0 011.846-2.178c.845-.549 1.909-.823 3.191-.823 1.164 0 2.183.245 3.057.734.875.481 1.553 1.2 2.035 2.156.482.955.723 2.137.723 3.545v10.857h-3.325V13.202c0-1.238-.322-2.204-.967-2.9-.645-.705-1.53-1.057-2.657-1.057-.771 0-1.457.167-2.057.5-.593.334-1.064.823-1.412 1.467-.341.638-.511 1.408-.511 2.312zM57.95 23.67V6.602h3.324v17.07H57.95zm1.679-19.703a2.114 2.114 0 01-1.49-.578c-.408-.392-.612-.859-.612-1.4 0-.548.204-1.015.612-1.4A2.092 2.092 0 0159.629 0c.578 0 1.07.196 1.479.589.415.385.622.852.622 1.4 0 .541-.207 1.008-.622 1.4-.408.386-.901.578-1.48.578zM54.824 6.59l-6.193 17.07h-3.558L38.87 6.59h3.57l4.324 13.135h.178L51.255 6.59h3.569zM29.69 24.003c-1.683 0-3.132-.359-4.347-1.078-1.209-.726-2.142-1.744-2.802-3.056-.652-1.318-.979-2.863-.979-4.634 0-1.748.327-3.29.979-4.623.66-1.333 1.579-2.374 2.757-3.122 1.186-.749 2.572-1.123 4.159-1.123.963 0 1.897.16 2.801.478a6.787 6.787 0 012.435 1.5c.72.682 1.286 1.567 1.701 2.656.416 1.082.623 2.397.623 3.945v1.178H23.441v-2.489H33.76c0-.874-.178-1.648-.533-2.323a4.034 4.034 0 00-1.501-1.61c-.638-.394-1.386-.59-2.246-.59-.934 0-1.75.23-2.446.69a4.625 4.625 0 00-1.601 1.777 5.131 5.131 0 00-.556 2.367v1.945c0 1.14.2 2.111.6 2.911.408.8.975 1.412 1.701 1.834.727.415 1.575.623 2.546.623a5.29 5.29 0 001.724-.267c.519-.186.967-.46 1.345-.823.378-.363.667-.81.867-1.344l3.147.567a5.694 5.694 0 01-1.357 2.433c-.645.69-1.456 1.226-2.435 1.612-.97.377-2.079.566-3.324.566zM7.371 23.666H0V.905h7.605c2.231 0 4.147.456 5.748 1.367 1.601.904 2.828 2.204 3.68 3.9.86 1.69 1.29 3.716 1.29 6.08 0 2.37-.434 4.408-1.3 6.112-.86 1.704-2.106 3.015-3.737 3.934-1.63.91-3.602 1.367-5.915 1.367zm-3.935-3.001h3.746c1.735 0 3.177-.326 4.325-.978 1.15-.66 2.01-1.611 2.58-2.856.57-1.252.856-2.778.856-4.579 0-1.785-.285-3.3-.856-4.545-.563-1.244-1.405-2.189-2.524-2.833-1.12-.645-2.509-.967-4.17-.967H3.437v16.758z" />
+    </svg>
+  );
+});
+
+export default Icon;
@@ -0,0 +1,72 @@
+---
+nav: Components
+group: Application
+title: Devin
+atomId: Devin
+description: https://devin.ai
+---
+
+## Icons
+
+```tsx
+import { Devin } from '@lobehub/icons';
+import { Flexbox } from '@lobehub/ui';
+
+export default () => (
+  <Flexbox gap={16} horizontal>
+    <Devin size={64} />
+    <Devin.Color size={64} />
+  </Flexbox>
+);
+```
+
+## Text
+
+```tsx
+import { Devin } from '@lobehub/icons';
+
+export default () => <Devin.Text size={48} />;
+```
+
+## Combine
+
+```tsx
+import { Devin } from '@lobehub/icons';
+import { Flexbox } from '@lobehub/ui';
+
+export default () => (
+  <Flexbox gap={16} align={'flex-start'}>
+    <Devin.Combine size={64} />
+    <Devin.Combine size={64} type={'color'} />
+  </Flexbox>
+);
+```
+
+## Avatars
+
+```tsx
+import { Devin } from '@lobehub/icons';
+import { Flexbox } from '@lobehub/ui';
+
+export default () => (
+  <Flexbox gap={16} horizontal>
+    <Devin.Avatar size={64} />
+    <Devin.Avatar size={64} shape={'square'} />
+  </Flexbox>
+);
+```
+
+## Colors
+
+```tsx
+import { Devin } from '@lobehub/icons';
+import { Flexbox } from '@lobehub/ui';
+
+import ColorPreview from '../components/ColorPreview';
+
+export default () => (
+  <Flexbox gap={16} horizontal>
+    <ColorPreview color={Devin.colorPrimary} />
+  </Flexbox>
+);
+```
@@ -0,0 +1,25 @@
+import Avatar from './components/Avatar';
+import Color from './components/Color';
+import Combine from './components/Combine';
+import Mono from './components/Mono';
+import Text from './components/Text';
+import { COLOR_PRIMARY, TITLE } from './style';
+
+export type CompoundedIcon = typeof Mono & {
+  Avatar: typeof Avatar;
+  Color: typeof Color;
+  Combine: typeof Combine;
+  Text: typeof Text;
+  colorPrimary: string;
+  title: string;
+};
+
+const Icons = Mono as CompoundedIcon;
+Icons.Color = Color;
+Icons.Text = Text;
+Icons.Combine = Combine;
+Icons.Avatar = Avatar;
+Icons.colorPrimary = COLOR_PRIMARY;
+Icons.title = TITLE;
+
+export default Icons;
@@ -0,0 +1,9 @@
+export const TITLE = 'Devin';
+export const COMBINE_TEXT_MULTIPLE = 0.55;
+export const COMBINE_SPACE_MULTIPLE = 0.2;
+export const COLOR_PRIMARY = '#fff';
+
+// Avatar constants
+export const AVATAR_BACKGROUND = COLOR_PRIMARY;
+export const AVATAR_COLOR = '#fff';
+export const AVATAR_ICON_MULTIPLE = 0.65;
@@ -0,0 +1,25 @@
+'use client';
+
+import { memo } from 'react';
+
+import IconAvatar, { type IconAvatarProps } from '@/features/IconAvatar';
+
+import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
+import Color from './Color';
+
+export type AvatarProps = Omit<IconAvatarProps, 'Icon'>;
+
+const Avatar = memo<AvatarProps>(({ ...rest }) => {
+  return (
+    <IconAvatar
+      Icon={Color}
+      aria-label={TITLE}
+      background={AVATAR_BACKGROUND}
+      color={AVATAR_COLOR}
+      iconMultiple={AVATAR_ICON_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Avatar;
@@ -0,0 +1,36 @@
+'use client';
+
+import { memo } from 'react';
+
+import type { IconType } from '@/types';
+
+import { TITLE } from '../style';
+
+const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
+  return (
+    <svg
+      height={size}
+      style={{ flex: 'none', lineHeight: 1, ...style }}
+      viewBox="0 0 24 24"
+      width={size}
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <title>{TITLE}</title>
+      <path
+        d="M18.8 0H5.2A5.2 5.2 0 000 5.2v13.6A5.2 5.2 0 005.2 24h13.6a5.2 5.2 0 005.2-5.2V5.2A5.2 5.2 0 0018.8 0z"
+        fill="#9046FF"
+      />
+      <path
+        d="M7.97 16.376c-1.644 3.642 1.86 4.556 4.443 2.424.76 2.39 3.608.607 4.631-1.247 2.251-4.084 1.342-8.249 1.108-9.108-1.6-5.859-9.6-5.869-10.976.03-.323 1.033-.328 2.206-.507 3.423-.09.617-.16 1.009-.393 1.655-.139.373-.323.7-.62 1.257-.458.865-.264 2.53 2.101 1.665l.224-.1h-.01l-.001.001z"
+        fill="#fff"
+      />
+      <path
+        d="M12.722 10.985c-.656 0-.755-.785-.755-1.252 0-.423.074-.756.218-.97a.61.61 0 01.537-.283c.229 0 .428.095.567.289.159.218.243.55.243.964 0 .785-.303 1.252-.805 1.252h-.005zm2.703 0c-.656 0-.755-.785-.755-1.252 0-.423.074-.756.219-.97a.61.61 0 01.536-.283c.229 0 .428.095.567.289.159.218.243.55.243.964 0 .785-.303 1.252-.805 1.252h-.005z"
+        fill="#000"
+      />
+    </svg>
+  );
+});
+
+export default Icon;
@@ -0,0 +1,30 @@
+'use client';
+
+import { memo } from 'react';
+
+import IconCombine, { type IconCombineProps } from '@/features/IconCombine';
+
+import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
+import Color from './Color';
+import Mono from './Mono';
+import Text from './Text';
+
+export interface CombineProps extends Omit<IconCombineProps, 'Icon' | 'Text'> {
+  type?: 'color' | 'mono';
+}
+const Combine = memo<CombineProps>(({ type = 'mono', ...rest }) => {
+  const Icon = type === 'color' ? Color : Mono;
+
+  return (
+    <IconCombine
+      Icon={Icon}
+      Text={Text}
+      aria-label={TITLE}
+      spaceMultiple={COMBINE_SPACE_MULTIPLE}
+      textMultiple={COMBINE_TEXT_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Combine;
@@ -0,0 +1,27 @@
+'use client';
+
+import { memo } from 'react';
+
+import type { IconType } from '@/types';
+
+import { TITLE } from '../style';
+
+const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
+  return (
+    <svg
+      fill="currentColor"
+      fillRule="evenodd"
+      height={size}
+      style={{ flex: 'none', lineHeight: 1, ...style }}
+      viewBox="0 0 24 24"
+      width={size}
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <title>{TITLE}</title>
+      <path d="M4.594 6.677C6.67-2.226 18.746-2.211 21.16 6.632c.353 1.297 1.725 7.582-1.673 13.747-1.545 2.797-5.841 5.49-6.99 1.883C8.6 25.477 3.315 24.1 5.789 18.609l-.318.143c-3.57 1.305-3.863-1.208-3.173-2.513.45-.84.727-1.335.937-1.897.353-.975.458-1.568.593-2.498.27-1.837.277-3.607.765-5.167zm8.37.01a.92.92 0 00-.81.428c-.217.323-.33.825-.33 1.462 0 .705.15 1.89 1.14 1.89h.008c.757 0 1.214-.705 1.214-1.89 0-.622-.127-1.125-.367-1.455a1.014 1.014 0 00-.855-.435zm4.08 0a.92.92 0 00-.81.428c-.217.323-.33.825-.33 1.462 0 .705.15 1.89 1.14 1.89h.008c.757 0 1.215-.705 1.215-1.89 0-.622-.128-1.125-.368-1.455a1.014 1.014 0 00-.855-.435z" />
+    </svg>
+  );
+});
+
+export default Icon;
@@ -0,0 +1,28 @@
+'use client';
+
+import { memo } from 'react';
+
+import type { IconType } from '@/types';
+
+import { TITLE } from '../style';
+
+const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
+  return (
+    <svg
+      fill="currentColor"
+      fillRule="evenodd"
+      height={size}
+      style={{ flex: 'none', lineHeight: 1, ...style }}
+      viewBox="0 0 75 24"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <title>{TITLE}</title>
+      <path d="M63.109.102l.084-.012c2.376-.3 5.556.652 7.412 2.153 2.46 1.983 3.742 4.752 4.095 7.854.78 6.871-2.372 13.009-9.693 13.833l-.049.005c-6.372.67-10.97-3.98-11.478-10.145C52.913 6.908 55.667.861 63.11.102zm1.767 22.56c1.751-.214 3.362-.669 4.79-1.757 5.126-3.907 5.176-13.678.11-17.656-1.836-1.442-4.11-1.973-6.402-1.864-2.489.28-4.882 1.088-6.44 3.16-3.276 4.363-3.105 12.814 1.397 16.353 1.946 1.53 4.173 1.915 6.545 1.765z" />
+      <path d="M63.327 5.65c2.534-.288 4.397 1.158 4.989 3.596.793 3.266.466 8.185-3.509 9.143-2.821.26-4.484-1.172-5.012-3.91-.6-3.108-.355-8.06 3.532-8.83zm1 11.515c2.991-.497 3.331-4.425 2.89-6.823-.371-2.017-1.139-3.365-3.362-3.463-3.15.408-3.191 4.428-2.878 6.839.26 2 1.147 3.518 3.35 3.447zM41.137.05c3.343-.013 7.226.095 9.45 3.044 1.911 2.535 1.986 6.818.122 9.401-.487.674-1.093 1.178-1.75 1.678 1.36 1.96 3.58 4.447 2.914 6.94a3.944 3.944 0 01-1.839 2.382c-1.3.741-3.127.648-4.295-.27-1.227-.963-2.095-2.884-2.867-4.245l-1.899-3.322-.84.002c.004 1.676.133 3.819-.183 5.437-.573 2.936-4.525 3.77-6.583 1.837-.942-.886-1.102-2.571-1.116-3.807.013-4.857-.025-9.716.005-14.572.02-1.192.334-2.87 1.348-3.625C35.32-.346 39.025.068 41.137.05zm-2.291 14.356c.96-.003 1.948-.018 2.906-.007a552.359 552.359 0 013.027 5.287c.781 1.412 1.51 3.173 3.447 3.024a2.784 2.784 0 001.192-.347 2.506 2.506 0 001.197-1.53c.26-.934-.014-1.828-.494-2.636-.901-1.516-2.094-2.974-2.997-4.48.917-.503 1.771-.96 2.418-1.818 1.243-1.652 1.487-4.146.95-6.107-1.455-5.299-8.269-4.437-12.515-4.46-1.99.002-4.014-.183-4.37 2.382-.146 1.047-.086 2.073-.087 3.127.026 4.003.017 8.01 0 12.013.034.964.065 2.484.834 3.183 1.39 1.262 3.952.746 4.344-1.258.23-1.177.16-2.279.162-3.476.003-.957-.024-1.934-.014-2.897z" />
+      <path d="M38.894 5.484c1.966-.017 6.305-.66 6.431 2.072.043.926-.026 1.335-.631 2.038-1.283.947-4.193.7-5.833.686-.005-.687-.07-4.344.033-4.796zm1.252 3.509c1.002.015 2.786.136 3.65-.308 1.494-2.37-2.398-1.93-3.647-1.926l-.003 2.234zM25.483.098c.933-.117 1.983.093 2.781.59 2.111 1.315 1.755 4.198 1.746 6.355l-.012 5.469.011 4.32c.028 3.174.506 6.293-3.399 7.109-.98.108-2.148-.087-2.963-.66-1.837-1.293-1.596-3.846-1.601-5.842l-.008-4.852-.007-5.141C22.024 4.356 21.53.73 25.483.098zm1.019 22.567c1.769-.412 2.085-1.246 2.2-2.948.064-.932.034-1.877.034-2.81V12.22l.001-5.088c0-2.533.544-6.006-3.093-5.75-2.793.608-2.308 3.13-2.295 5.398l.008 4.334-.003 5.695c-.003 2.512-.58 6.232 3.148 5.856zM3.382.095A7.48 7.48 0 014 .07C8.106.11 7.925 4.077 7.86 7.01c.248-.212.524-.517.758-.755 1.497-1.523 2.961-3.079 4.466-4.594C14.027.71 14.96.055 16.36.074A3.68 3.68 0 0118.981 1.2c.632.668.967 1.563.93 2.482-.066 1.95-1.744 3.27-3.057 4.511l-2.357 2.225c1.716 2.314 3.454 4.849 5.052 7.255 1.035 1.558.951 3.282-.081 4.865-.257.314-.56.587-.9.809-1.494.97-3.767.863-5.027-.442-.891-.924-1.427-2.04-2.07-3.135-.805-1.374-1.559-2.785-2.404-4.132l-1.198 1.147c.085 2.68.387 6.41-3.053 7.107-2.222.45-4.244-.683-4.618-2.994-.215-1.324-.157-2.589-.154-3.927l.004-4.966-.006-4.416C.015 4.506-.544.772 3.382.095zm3.207 16.157c.903-.904 1.823-1.79 2.76-2.66 1.059 1.662 1.99 3.433 3.007 5.12.623 1.032 1.207 2.363 2.032 3.226 1.374 1.437 3.903.825 4.506-1.078.08-.512.163-1.156-.033-1.646-.423-1.056-1.297-2.202-1.955-3.139l-2.582-3.669c-.463-.66-1.08-1.49-1.493-2.16l2.816-2.687c.854-.81 1.963-1.72 2.585-2.7 1.402-2.207-1.15-4.468-3.27-3.106-.818.525-1.446 1.387-2.159 2.04C11.192 5.34 9.677 7.126 8.04 8.628l-1.45.012c-.02-2.455.836-7.311-2.71-7.28a3.28 3.28 0 00-.339.02c-1.709.427-2.089 1.268-2.221 2.943-.066.827-.024 1.68-.018 2.509l.01 3.835-.003 5.548c-.002 1.635-.124 3.223.238 4.825.463 2.045 3.643 2.27 4.536.549.748-1.441.54-3.73.507-5.337z" />
+    </svg>
+  );
+});
+
+export default Icon;
@@ -0,0 +1,72 @@
+---
+nav: Components
+group: Application
+title: Kiro
+atomId: Kiro
+description: https://kiro.dev
+---
+
+## Icons
+
+```tsx
+import { Kiro } from '@lobehub/icons';
+import { Flexbox } from '@lobehub/ui';
+
+export default () => (
+  <Flexbox gap={16} horizontal>
+    <Kiro size={64} />
+    <Kiro.Color size={64} />
+  </Flexbox>
+);
+```
+
+## Text
+
+```tsx
+import { Kiro } from '@lobehub/icons';
+
+export default () => <Kiro.Text size={48} />;
+```
+
+## Combine
+
+```tsx
+import { Kiro } from '@lobehub/icons';
+import { Flexbox } from '@lobehub/ui';
+
+export default () => (
+  <Flexbox gap={16} align={'flex-start'}>
+    <Kiro.Combine size={64} />
+    <Kiro.Combine size={64} type={'color'} />
+  </Flexbox>
+);
+```
+
+## Avatars
+
+```tsx
+import { Kiro } from '@lobehub/icons';
+import { Flexbox } from '@lobehub/ui';
+
+export default () => (
+  <Flexbox gap={16} horizontal>
+    <Kiro.Avatar size={64} />
+    <Kiro.Avatar size={64} shape={'square'} />
+  </Flexbox>
+);
+```
+
+## Colors
+
+```tsx
+import { Kiro } from '@lobehub/icons';
+import { Flexbox } from '@lobehub/ui';
+
+import ColorPreview from '../components/ColorPreview';
+
+export default () => (
+  <Flexbox gap={16} horizontal>
+    <ColorPreview color={Kiro.colorPrimary} />
+  </Flexbox>
+);
+```
@@ -0,0 +1,25 @@
+import Avatar from './components/Avatar';
+import Color from './components/Color';
+import Combine from './components/Combine';
+import Mono from './components/Mono';
+import Text from './components/Text';
+import { COLOR_PRIMARY, TITLE } from './style';
+
+export type CompoundedIcon = typeof Mono & {
+  Avatar: typeof Avatar;
+  Color: typeof Color;
+  Combine: typeof Combine;
+  Text: typeof Text;
+  colorPrimary: string;
+  title: string;
+};
+
+const Icons = Mono as CompoundedIcon;
+Icons.Color = Color;
+Icons.Text = Text;
+Icons.Combine = Combine;
+Icons.Avatar = Avatar;
+Icons.colorPrimary = COLOR_PRIMARY;
+Icons.title = TITLE;
+
+export default Icons;
@@ -0,0 +1,9 @@
+export const TITLE = 'Kiro';
+export const COMBINE_TEXT_MULTIPLE = 0.7;
+export const COMBINE_SPACE_MULTIPLE = 0.25;
+export const COLOR_PRIMARY = '#9046ff';
+
+// Avatar constants
+export const AVATAR_BACKGROUND = COLOR_PRIMARY;
+export const AVATAR_COLOR = '#fff';
+export const AVATAR_ICON_MULTIPLE = 1;
@@ -8,7 +8,7 @@ import type { IconType } from '@/types';
 import { TITLE } from '../style';

 const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
-  const [a, b, c] = useFillIds(TITLE, 3);
+  const [a, b, c, d, e, f, g] = useFillIds(TITLE, 7);
  return (
    <svg
      height={size}
@@ -19,48 +19,87 @@ const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
      {...rest}
    >
      <title>{TITLE}</title>
-      <g clipPath={a.fill} filter={b.fill}>
-        <path
-          clipRule="evenodd"
-          d="M12 0c6.627 0 12 5.373 12 12s-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0zm0 3.627a8.373 8.373 0 100 16.746 8.373 8.373 0 000-16.746z"
-          fill={c.fill}
-          fillRule="evenodd"
-        />
-      </g>
+
+      <path
+        d="M10.547.232c.776-.086 1.543.244 2.152.712.784.598 1.375 1.434 1.757 2.347.19.444.3.92.345 1.402.01.384.024.781-.108 1.148-.126.406-.362.795-.728 1.017-.352.236-.786.3-1.199.288-.84-.073-1.613-.52-2.212-1.106-.15-.1-.236-.263-.368-.38-.801-.97-1.394-2.203-1.324-3.496.048-.698.38-1.44 1.03-1.75.206-.1.428-.164.655-.182z"
+        fill={a.fill}
+      />
+      <path
+        d="M18.595 3.077c.52-.045 1.032.186 1.4.551.402.434.625 1.006.736 1.584.096.605.09 1.233-.048 1.83a5.97 5.97 0 01-.907 2.19c-.198.25-.382.519-.633.719-.493.45-1.181.725-1.848.598-.42-.08-.819-.306-1.085-.646-.514-.591-.687-1.403-.714-2.17a6.11 6.11 0 011.03-3.285c.237-.314.49-.62.797-.867.375-.27.805-.486 1.272-.504z"
+        fill={b.fill}
+      />
+      <path
+        d="M5.038 4.172c.618-.045 1.238.067 1.832.235.871.28 1.741.78 2.182 1.624.177.383.256.826.152 1.242-.097.442-.375.816-.71 1.105-.724.59-1.664.84-2.577.887a5.356 5.356 0 01-2.881-.675c-.39-.248-.765-.539-1.025-.93a1.9 1.9 0 01-.327-1.283c.067-.507.357-.968.741-1.289.723-.62 1.684-.873 2.613-.916z"
+        fill={c.fill}
+      />
+      <path
+        d="M4.87 10.369c.69-.06 1.465.223 1.811.866.213.349.278.763.29 1.166.006.528-.136 1.046-.34 1.529-.34.793-.893 1.478-1.538 2.036-.64.538-1.42.951-2.26 1.015a2.031 2.031 0 01-1.467-.398c-.353-.281-.578-.707-.662-1.15-.156-.8.077-1.62.445-2.327.196-.377.444-.724.72-1.044.767-.886 1.814-1.608 3.001-1.693z"
+        fill={d.fill}
+      />
+      <path
+        d="M20.391 11.05c.881-.087 1.872.116 2.477.822.473.58.534 1.425.239 2.102-.118.317-.32.59-.527.852-.877.962-2.11 1.553-3.379 1.744-.818.123-1.723.036-2.406-.477-.2-.161-.386-.346-.514-.573-.277-.436-.321-.994-.216-1.492.224-.904.92-1.594 1.676-2.073a5.874 5.874 0 012.65-.905z"
+        fill={e.fill}
+      />
+      <path
+        d="M7.553 15.523c.381-.052.775.004 1.118.184.344.154.613.427.866.702.866 1.097 1.267 2.549 1.146 3.944a4.476 4.476 0 01-.497 1.61c-.273.469-.663.91-1.187 1.08-.35.103-.731.118-1.077-.005a2.53 2.53 0 01-.959-.612c-.798-.859-1.236-2.02-1.343-3.185-.055-.646-.006-1.31.21-1.923.146-.471.384-.92.738-1.265.261-.277.62-.452.985-.53z"
+        fill={f.fill}
+      />
+      <path
+        d="M13.637 16.5a4.237 4.237 0 011.82.219c.795.286 1.542.724 2.148 1.323.535.504.963 1.162 1.099 1.899.055.379.038.785-.122 1.138-.19.465-.599.807-1.051.996-.883.364-1.887.253-2.76-.082a5.568 5.568 0 01-2.343-1.685c-.347-.445-.616-.968-.697-1.534-.042-.382-.036-.788.13-1.142.194-.418.55-.76.978-.925.25-.119.525-.174.798-.207z"
+        fill={g.fill}
+      />
+
      <defs>
-        <linearGradient gradientUnits="userSpaceOnUse" id={c.id} x1="24" x2="0" y1="0" y2="24">
-          <stop offset=".13" stopColor="#FF97E3" />
-          <stop offset=".18" stopColor="#D14FE1" />
-          <stop offset=".338" stopColor="#0050E2" />
-          <stop offset=".666" stopColor="#0050E2" />
-          <stop offset=".809" stopColor="#00DDF4" />
-          <stop offset=".858" stopColor="#23F8CC" />
+        <linearGradient gradientUnits="userSpaceOnUse" id={a.id} x1="9.789" x2="13" y1="0" y2="7.5">
+          <stop stopColor="#C65EFF" />
+          <stop offset=".5" stopColor="#EA4FFF" />
+          <stop offset="1" stopColor="#9553FF" />
        </linearGradient>
-        <clipPath id={a.id}>
-          <path d="M0 0h24v24H0z" fill="#fff" />
-        </clipPath>
-        <filter
-          colorInterpolationFilters="sRGB"
-          filterUnits="userSpaceOnUse"
-          height="24"
-          id={b.id}
-          width="24"
-          x="0"
-          y="0"
+        <linearGradient gradientUnits="userSpaceOnUse" id={b.id} x1="19" x2="17" y1="3" y2="10.5">
+          <stop stopColor="#CF72FF" />
+          <stop offset=".5" stopColor="#E541FF" />
+          <stop offset="1" stopColor="#944DFF" />
+        </linearGradient>
+        <linearGradient gradientUnits="userSpaceOnUse" id={c.id} x1="9" x2="2.5" y1="6.5" y2="8">
+          <stop stopColor="#A555FF" />
+          <stop offset=".5" stopColor="#DE67FF" />
+          <stop offset="1" stopColor="#E581FF" />
+        </linearGradient>
+        <linearGradient gradientUnits="userSpaceOnUse" id={d.id} x1="1" x2="6" y1="12" y2="16">
+          <stop stopColor="#6C48FF" />
+          <stop offset=".309" stopColor="#AA5AFF" />
+          <stop offset="1" stopColor="#5145FF" />
+        </linearGradient>
+        <linearGradient
+          gradientUnits="userSpaceOnUse"
+          id={e.id}
+          x1="19"
+          x2="21"
+          y1="11.5"
+          y2="16.5"
        >
-          <feFlood floodOpacity="0" result="BackgroundImageFix" />
-          <feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape" />
-          <feColorMatrix
-            in="SourceAlpha"
-            result="hardAlpha"
-            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
-          />
-          <feOffset />
-          <feGaussianBlur stdDeviation=".75" />
-          <feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic" />
-          <feColorMatrix values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.5 0" />
-          <feBlend in2="shape" result="effect1_innerShadow_674_237" />
-        </filter>
+          <stop stopColor="#CA3EFF" />
+          <stop offset=".5" stopColor="#AB5CFF" />
+          <stop offset="1" stopColor="#5042FF" />
+        </linearGradient>
+        <linearGradient gradientUnits="userSpaceOnUse" id={f.id} x1="6" x2="11" y1="20.5" y2="19">
+          <stop stopColor="#5041FF" />
+          <stop offset=".26" stopColor="#734FFF" />
+          <stop offset=".75" stopColor="#6A4CFF" />
+          <stop offset="1" stopColor="#483FFF" />
+        </linearGradient>
+        <linearGradient
+          gradientUnits="userSpaceOnUse"
+          id={g.id}
+          x1="12"
+          x2="18.5"
+          y1="17.5"
+          y2="21.5"
+        >
+          <stop stopColor="#7B51FF" />
+          <stop offset=".475" stopColor="#6049FF" />
+          <stop offset="1" stopColor="#8466FF" />
+        </linearGradient>
      </defs>
    </svg>
  );
@@ -19,10 +19,7 @@ const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
      {...rest}
    >
      <title>{TITLE}</title>
-      <path
-        clipRule="evenodd"
-        d="M12 0c6.627 0 12 5.373 12 12s-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0zm0 3.627a8.373 8.373 0 100 16.746 8.373 8.373 0 000-16.746z"
-      />
+      <path d="M10.547.232c.776-.086 1.543.244 2.152.712.784.598 1.375 1.434 1.757 2.347.19.444.3.92.345 1.402.01.384.024.781-.108 1.148-.126.406-.362.795-.728 1.017-.352.236-.786.3-1.199.288-.84-.073-1.613-.52-2.212-1.106-.15-.1-.236-.263-.368-.38-.801-.97-1.394-2.203-1.324-3.496.048-.698.38-1.44 1.03-1.75.206-.1.428-.164.655-.182zM18.595 3.077c.52-.045 1.032.186 1.4.551.402.434.625 1.006.736 1.584.096.605.09 1.233-.048 1.83a5.97 5.97 0 01-.907 2.19c-.198.25-.382.519-.633.719-.493.45-1.181.725-1.848.598-.42-.08-.819-.306-1.085-.646-.514-.591-.687-1.403-.714-2.17a6.11 6.11 0 011.03-3.285c.237-.314.49-.62.797-.867.375-.27.805-.486 1.272-.504zM5.038 4.172c.618-.045 1.238.067 1.832.235.871.28 1.741.78 2.182 1.624.177.383.256.826.152 1.242-.097.442-.375.816-.71 1.105-.724.59-1.664.84-2.577.887a5.356 5.356 0 01-2.881-.675c-.39-.248-.765-.539-1.025-.93a1.9 1.9 0 01-.327-1.283c.067-.507.357-.968.741-1.289.723-.62 1.684-.873 2.613-.916zM4.87 10.369c.69-.06 1.465.223 1.811.866.213.349.278.763.29 1.166.006.528-.136 1.046-.34 1.529-.34.793-.893 1.478-1.538 2.036-.64.538-1.42.951-2.26 1.015a2.031 2.031 0 01-1.467-.398c-.353-.281-.578-.707-.662-1.15-.156-.8.077-1.62.445-2.327.196-.377.444-.724.72-1.044.767-.886 1.814-1.608 3.001-1.693zM20.391 11.05c.881-.087 1.872.116 2.477.822.473.58.534 1.425.239 2.102-.118.317-.32.59-.527.852-.877.962-2.11 1.553-3.379 1.744-.818.123-1.723.036-2.406-.477-.2-.161-.386-.346-.514-.573-.277-.436-.321-.994-.216-1.492.224-.904.92-1.594 1.676-2.073a5.874 5.874 0 012.65-.905zM7.553 15.523c.381-.052.775.004 1.118.184.344.154.613.427.866.702.866 1.097 1.267 2.549 1.146 3.944a4.476 4.476 0 01-.497 1.61c-.273.469-.663.91-1.187 1.08-.35.103-.731.118-1.077-.005a2.53 2.53 0 01-.959-.612c-.798-.859-1.236-2.02-1.343-3.185-.055-.646-.006-1.31.21-1.923.146-.471.384-.92.738-1.265.261-.277.62-.452.985-.53zM13.637 16.5a4.237 4.237 0 011.82.219c.795.286 1.542.724 2.148 1.323.535.504.963 1.162 1.099 1.899.055.379.038.785-.122 1.138-.19.465-.599.807-1.051.996-.883.364-1.887.253-2.76-.082a5.568 5.568 0 01-2.343-1.685c-.347-.445-.616-.968-.697-1.534-.042-.382-.036-.788.13-1.142.194-.418.55-.76.978-.925.25-.119.525-.174.798-.207z" />
    </svg>
  );
 });
@@ -0,0 +1,25 @@
+'use client';
+
+import { memo } from 'react';
+
+import IconAvatar, { type IconAvatarProps } from '@/features/IconAvatar';
+
+import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
+import Mono from './Mono';
+
+export type AvatarProps = Omit<IconAvatarProps, 'Icon'>;
+
+const Avatar = memo<AvatarProps>(({ ...rest }) => {
+  return (
+    <IconAvatar
+      Icon={Mono}
+      aria-label={TITLE}
+      background={AVATAR_BACKGROUND}
+      color={AVATAR_COLOR}
+      iconMultiple={AVATAR_ICON_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Avatar;
@@ -0,0 +1,31 @@
+'use client';
+
+import { memo } from 'react';
+
+import type { IconType } from '@/types';
+
+import { TITLE } from '../style';
+
+const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
+  return (
+    <svg
+      height={size}
+      style={{ flex: 'none', lineHeight: 1, ...style }}
+      viewBox="0 0 24 24"
+      width={size}
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <title>{TITLE}</title>
+      <path d="M12.03 11.936v6.22L6.477 15.05l-.002-6.21 5.557 3.095z" fill="#29C16A" />
+      <path
+        clipRule="evenodd"
+        d="M10.646.36a2.77 2.77 0 012.729 0l8.284 4.713A2.623 2.623 0 0123 7.347v9.34c0 .936-.511 1.803-1.341 2.276l-8.23 4.678a2.77 2.77 0 01-2.727.001l-8.36-4.745A2.623 2.623 0 011 16.621v-4.553l.001-.002H1V7.36c0-.936.51-1.803 1.34-2.276L10.646.36zm1.882 4.12a1.03 1.03 0 00-1.015 0L5.612 7.838a.975.975 0 00-.498.846v6.643c0 .349.19.671.499.846l5.883 3.349a1.03 1.03 0 001.011.002l5.875-3.306a.977.977 0 00.503-.848v-6.71c0-.349-.19-.671-.5-.847l-5.857-3.331z"
+        fill="#29C16A"
+        fillRule="evenodd"
+      />
+    </svg>
+  );
+});
+
+export default Icon;
@@ -0,0 +1,30 @@
+'use client';
+
+import { memo } from 'react';
+
+import IconCombine, { type IconCombineProps } from '@/features/IconCombine';
+
+import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
+import Color from './Color';
+import Mono from './Mono';
+import Text from './Text';
+
+export interface CombineProps extends Omit<IconCombineProps, 'Icon' | 'Text'> {
+  type?: 'color' | 'mono';
+}
+const Combine = memo<CombineProps>(({ type = 'mono', ...rest }) => {
+  const Icon = type === 'color' ? Color : Mono;
+
+  return (
+    <IconCombine
+      Icon={Icon}
+      Text={Text}
+      aria-label={TITLE}
+      spaceMultiple={COMBINE_SPACE_MULTIPLE}
+      textMultiple={COMBINE_TEXT_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Combine;
@@ -0,0 +1,31 @@
+'use client';
+
+import { memo } from 'react';
+
+import type { IconType } from '@/types';
+
+import { TITLE } from '../style';
+
+const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
+  return (
+    <svg
+      fill="currentColor"
+      fillRule="evenodd"
+      height={size}
+      style={{ flex: 'none', lineHeight: 1, ...style }}
+      viewBox="0 0 24 24"
+      width={size}
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <title>{TITLE}</title>
+      <path d="M12.03 11.936v6.22L6.477 15.05l-.002-6.21 5.557 3.095z" />
+      <path
+        clipRule="evenodd"
+        d="M10.646.36a2.77 2.77 0 012.729 0l8.284 4.713A2.623 2.623 0 0123 7.347v9.34c0 .936-.511 1.803-1.341 2.276l-8.23 4.678a2.77 2.77 0 01-2.727.001l-8.36-4.745A2.623 2.623 0 011 16.621v-4.553l.001-.002H1V7.36c0-.936.51-1.803 1.34-2.276L10.646.36zm1.882 4.12a1.03 1.03 0 00-1.015 0L5.612 7.838a.975.975 0 00-.498.846v6.643c0 .349.19.671.499.846l5.883 3.349a1.03 1.03 0 001.011.002l5.875-3.306a.977.977 0 00.503-.848v-6.71c0-.349-.19-.671-.5-.847l-5.857-3.331z"
+      />
+    </svg>
+  );
+});
+
+export default Icon;
@@ -0,0 +1,26 @@
+'use client';
+
+import { memo } from 'react';
+
+import type { IconType } from '@/types';
+
+import { TITLE } from '../style';
+
+const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
+  return (
+    <svg
+      fill="currentColor"
+      fillRule="evenodd"
+      height={size}
+      style={{ flex: 'none', lineHeight: 1, ...style }}
+      viewBox="0 0 65 24"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <title>{TITLE}</title>
+      <path d="M51.87 6.849s.565-.027.295.444l-4.57 7.31a.8.8 0 000 .811l4.55 7.115h-.05c.144.359-.088.467-.098.471h-3.763a.694.694 0 01-.615-.366l-2.361-4.003a.356.356 0 00-.614 0l-2.336 4.003a.694.694 0 01-.616.366H37.56c-.073-.026-.22-.105-.097-.419l4.623-7.141a.798.798 0 000-.811L37.487 7.33c-.295-.47.295-.47.295-.47h3.664c.246 0 .468.13.591.34l2.36 3.845a.356.356 0 00.616 0l2.504-3.883c.147-.183.37-.313.59-.313h3.762zm7.11-4.358c.37 0 .689.314.689.733v3.61h2.706v.025c.369 0 .663.315.663.707v2.067c0 .392-.294.706-.663.706h-2.706v7.246c-.049 1.588 1.558 1.596 1.574 1.596h1.23c.196 0 .565.131.565.811v2.276c0 .392-.295.732-.688.732h-3.148c-1.918 0-3.492-1.674-3.492-3.715V10.34h-1.525c-.368 0-.663-.314-.663-.706V7.566c0-.392.295-.707.663-.707h1.5V3.224c0-.393.296-.733.689-.733h2.606zM29.52 6.075c4.386 0 7.943 3.783 7.943 8.45 0 4.666-3.557 8.45-7.944 8.45-4.386 0-7.943-3.784-7.943-8.45 0-4.667 3.557-8.45 7.944-8.45zM5.934 1c.12 0 .29.153.294.157l4.255 7.115c.123.21.443.21.566 0l4.328-7.115c.048-.102.26-.155.27-.157h3.173c.37 0 .689.314.689.732V22.19c0 .393-.295.733-.689.733h-2.828c-.369 0-.688-.314-.688-.733V9.005c0-.55-.345 0-.345 0l-3.64 6.068a.667.667 0 01-1.155 0l-3.64-5.937s-.27-.419-.32 0v13.053a.752.752 0 01-.688.76H2.64C2.28 22.93 2 22.606 2 22.214V1.732C2 1.34 2.295 1 2.688 1h3.247zm23.584 9.209c-2.241 0-4.058 1.933-4.058 4.316 0 2.384 1.817 4.316 4.058 4.316 2.24 0 4.058-1.932 4.058-4.316 0-2.383-1.817-4.316-4.058-4.316z" />
+    </svg>
+  );
+});
+
+export default Icon;
@@ -0,0 +1,72 @@
+---
+nav: Components
+group: Application
+title: Moxt
+atomId: Moxt
+description: https://moxt.ai
+---
+
+## Icons
+
+```tsx
+import { Moxt } from '@lobehub/icons';
+import { Flexbox } from '@lobehub/ui';
+
+export default () => (
+  <Flexbox gap={16} horizontal>
+    <Moxt size={64} />
+    <Moxt.Color size={64} />
+  </Flexbox>
+);
+```
+
+## Text
+
+```tsx
+import { Moxt } from '@lobehub/icons';
+
+export default () => <Moxt.Text size={48} />;
+```
+
+## Combine
+
+```tsx
+import { Moxt } from '@lobehub/icons';
+import { Flexbox } from '@lobehub/ui';
+
+export default () => (
+  <Flexbox gap={16} align={'flex-start'}>
+    <Moxt.Combine size={64} />
+    <Moxt.Combine size={64} type={'color'} />
+  </Flexbox>
+);
+```
+
+## Avatars
+
+```tsx
+import { Moxt } from '@lobehub/icons';
+import { Flexbox } from '@lobehub/ui';
+
+export default () => (
+  <Flexbox gap={16} horizontal>
+    <Moxt.Avatar size={64} />
+    <Moxt.Avatar size={64} shape={'square'} />
+  </Flexbox>
+);
+```
+
+## Colors
+
+```tsx
+import { Moxt } from '@lobehub/icons';
+import { Flexbox } from '@lobehub/ui';
+
+import ColorPreview from '../components/ColorPreview';
+
+export default () => (
+  <Flexbox gap={16} horizontal>
+    <ColorPreview color={Moxt.colorPrimary} />
+  </Flexbox>
+);
+```
@@ -0,0 +1,25 @@
+import Avatar from './components/Avatar';
+import Color from './components/Color';
+import Combine from './components/Combine';
+import Mono from './components/Mono';
+import Text from './components/Text';
+import { COLOR_PRIMARY, TITLE } from './style';
+
+export type CompoundedIcon = typeof Mono & {
+  Avatar: typeof Avatar;
+  Color: typeof Color;
+  Combine: typeof Combine;
+  Text: typeof Text;
+  colorPrimary: string;
+  title: string;
+};
+
+const Icons = Mono as CompoundedIcon;
+Icons.Color = Color;
+Icons.Text = Text;
+Icons.Combine = Combine;
+Icons.Avatar = Avatar;
+Icons.colorPrimary = COLOR_PRIMARY;
+Icons.title = TITLE;
+
+export default Icons;
@@ -0,0 +1,9 @@
+export const TITLE = 'Moxt';
+export const COMBINE_TEXT_MULTIPLE = 0.8;
+export const COMBINE_SPACE_MULTIPLE = 0.2;
+export const COLOR_PRIMARY = '#29C16A';
+
+// Avatar constants
+export const AVATAR_BACKGROUND = '#fff';
+export const AVATAR_COLOR = COLOR_PRIMARY;
+export const AVATAR_ICON_MULTIPLE = 0.75;
@@ -0,0 +1,25 @@
+'use client';
+
+import { memo } from 'react';
+
+import IconAvatar, { type IconAvatarProps } from '@/features/IconAvatar';
+
+import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
+import Mono from './Mono';
+
+export type AvatarProps = Omit<IconAvatarProps, 'Icon'>;
+
+const Avatar = memo<AvatarProps>(({ ...rest }) => {
+  return (
+    <IconAvatar
+      Icon={Mono}
+      aria-label={TITLE}
+      background={AVATAR_BACKGROUND}
+      color={AVATAR_COLOR}
+      iconMultiple={AVATAR_ICON_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Avatar;
@@ -0,0 +1,29 @@
+'use client';
+
+import { memo } from 'react';
+
+import IconCombine, { type IconCombineProps } from '@/features/IconCombine';
+
+import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
+import Mono from './Mono';
+import Text from './Text';
+
+export type CombineProps = Omit<IconCombineProps, 'Icon' | 'Text'>;
+
+const Combine = memo<CombineProps>(({ ...rest }) => {
+  return (
+    <IconCombine
+      Icon={Mono}
+      Text={Text as any}
+      aria-label={TITLE}
+      iconProps={{
+        shape: 'square',
+      }}
+      spaceMultiple={COMBINE_SPACE_MULTIPLE}
+      textMultiple={COMBINE_TEXT_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Combine;
--- a/Show More
+++ b/Show More