Korean Minimal
韩式极简
stylekitMITLuxury & fashion · luxury-fashionMinimal · minimalRegional · regionalLight · lightMedium · mediumBlue · blueMedium · mediumSerif · serifLanding · landing
韩国极简设计美学,受K-beauty和韩国建筑影响。柔和的粉彩色调、大量留白、精致的圆角和克制的装饰。
NNorthwind
Product · PricingSpecimen
Make the work feel finished
One interface, dressed in this style. Compare type, color, radius, and density.
128
Active
4.8
Score
12ms
Edge
Attribution
"Korean Minimal" from https://github.com/AnxForever/stylekit (MIT). © AnxForever. api/styles/korean-minimal @ bfa7da909e86.
https://github.com/AnxForever/stylekit · api/styles/korean-minimal · bfa7da909e86 · © AnxForever
Do
- 使用大量留白 p-8 md:p-12 lg:p-16 营造呼吸感
- 使用温暖白 bg-[#faf9f7] 作为主背景色
- 使用石板蓝 text-[#3d4a5c] 作为主要文本色
- 使用粉彩色做微妙的点缀 text-[#d4a5a5], bg-[#a8c5b8]/10
- 使用精致的大圆角 rounded-2xl 或 rounded-3xl
- 采用极细边框 border border-[#3d4a5c]/10
- 使用柔和的阴影 shadow-sm 或自定义浅阴影
- 字体轻盈干净 font-light 或 font-normal, tracking-wide
Don't
- 禁止使用高饱和度的纯色 bg-red-500, bg-blue-600
- 禁止使用粗重边框 border-2, border-4
- 禁止使用 uppercase 和 tracking-widest(过于强势)
- 禁止使用深色/黑色背景 bg-black, bg-[#0a0a0a]
- 禁止过度装饰和元素堆叠
- 禁止使用霓虹色或荧光色
Prompt
Use Korean Minimal style to create a beauty brand page: 1. Background: warm white with generous whitespace 2. Title: light weight font in slate blue 3. Cards: thin borders, large padding, subtle shadows 4. Buttons: rounded-2xl with soft hover effects 5. Decorations: thin lines and tiny pastel dots only --- "Korean Minimal" from https://github.com/AnxForever/stylekit (MIT). © AnxForever. api/styles/korean-minimal @ bfa7da909e86. powered by Styledex — https://styledex.dev
Tokens
DTCG
{
"$schema": "https://www.designtokens.org/schemas/2025.10/format.json",
"$description": "Korean Minimal. \"Korean Minimal\" from https://github.com/AnxForever/stylekit (MIT). © AnxForever. api/styles/korean-minimal @ bfa7da909e86.",
"$extensions": {
"dev.styledex": {
"id": "stylekit-korean-minimal",
"license": "MIT",
"attribution": "\"Korean Minimal\" from https://github.com/AnxForever/stylekit (MIT). © AnxForever. api/styles/korean-minimal @ bfa7da909e86.",
"banner": "powered by Styledex — https://styledex.dev"
}
},
"color": {
"background": {
"$type": "color",
"$value": "#faf9f7"
},
"foreground": {
"$type": "color",
"$value": "#3d4a5c"
},
"card": {
"$type": "color",
"$value": "#faf9f7"
},
"card-foreground": {
"$type": "color",
"$value": "#3d4a5c"
},
"primary": {
"$type": "color",
"$value": "#3d4a5c"
},
"primary-foreground": {
"$type": "color",
"$value": "#fafaf9"
},
"secondary": {
"$type": "color",
"$value": "#faf9f7"
},
"secondary-foreground": {
"$type": "color",
"$value": "#3d4a5c"
},
"accent": {
"$type": "color",
"$value": "#d4a5a5"
},
"accent-foreground": {
"$type": "color",
"$value": "#fafaf9"
},
"muted": {
"$type": "color",
"$value": "#ebeae8"
},
"muted-foreground": {
"$type": "color",
"$value": "#818995"
},
"border": {
"$type": "color",
"$value": "#d7d6d4"
},
"destructive": {
"$type": "color",
"$value": "#dc2626"
},
"ring": {
"$type": "color",
"$value": "#3d4a5c"
}
},
"font": {
"sans": {
"$type": "fontFamily",
"$value": [
"ui-sans-serif",
"system-ui",
"sans-serif"
]
},
"serif": {
"$type": "fontFamily",
"$value": [
"ui-serif",
"Georgia",
"serif"
]
},
"mono": {
"$type": "fontFamily",
"$value": [
"ui-monospace",
"SFMono-Regular",
"Menlo",
"monospace"
]
}
},
"radius": {
"base": {
"$type": "dimension",
"$value": "0.5rem"
}
},
"spacing": {
"base": {
"$type": "dimension",
"$value": "1rem"
}
},
"shadow": {
"base": {
"$type": "shadow",
"$value": "0 4px 12px rgba(61,74,92,0.06)"
}
}
}
CSS
/* powered by Styledex — https://styledex.dev */
/* "Korean Minimal" from https://github.com/AnxForever/stylekit (MIT). © AnxForever. api/styles/korean-minimal @ bfa7da909e86. */
:root {
--background: #faf9f7;
--foreground: #3d4a5c;
--card: #faf9f7;
--card-foreground: #3d4a5c;
--primary: #3d4a5c;
--primary-foreground: #fafaf9;
--secondary: #faf9f7;
--secondary-foreground: #3d4a5c;
--accent: #d4a5a5;
--accent-foreground: #fafaf9;
--muted: #ebeae8;
--muted-foreground: #818995;
--border: #d7d6d4;
--destructive: #dc2626;
--ring: #3d4a5c;
--radius: 0.5rem;
--font-sans: ui-sans-serif, system-ui, sans-serif;
--font-serif: ui-serif, Georgia, serif;
--font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
--spacing: 1rem;
--shadow: 0 4px 12px rgba(61,74,92,0.06);
}
Tailwind
/* powered by Styledex — https://styledex.dev */
/* "Korean Minimal" from https://github.com/AnxForever/stylekit (MIT). © AnxForever. api/styles/korean-minimal @ bfa7da909e86. */
/** Tailwind theme extend for Korean Minimal (stylekit-korean-minimal) */
module.exports = {
"theme": {
"extend": {
"colors": {
"background": "#faf9f7",
"foreground": "#3d4a5c",
"card": "#faf9f7",
"primary": "#3d4a5c",
"primary-foreground": "#fafaf9",
"secondary": "#faf9f7",
"accent": "#d4a5a5",
"muted": "#ebeae8",
"border": "#d7d6d4",
"destructive": "#dc2626",
"ring": "#3d4a5c"
},
"borderRadius": {
"lg": "0.5rem"
},
"fontFamily": {
"sans": [
"ui-sans-serif",
"system-ui",
"sans-serif"
],
"serif": [
"ui-serif",
"Georgia",
"serif"
],
"mono": [
"ui-monospace",
"SFMono-Regular",
"Menlo",
"monospace"
]
},
"boxShadow": {
"styledex": "0 4px 12px rgba(61,74,92,0.06)"
}
}
}
};
shadcn
/* powered by Styledex — https://styledex.dev */
/* "Korean Minimal" from https://github.com/AnxForever/stylekit (MIT). © AnxForever. api/styles/korean-minimal @ bfa7da909e86. */
@layer base {
:root {
--background: #faf9f7;
--foreground: #3d4a5c;
--card: #faf9f7;
--card-foreground: #3d4a5c;
--primary: #3d4a5c;
--primary-foreground: #fafaf9;
--secondary: #faf9f7;
--secondary-foreground: #3d4a5c;
--accent: #d4a5a5;
--accent-foreground: #fafaf9;
--muted: #ebeae8;
--muted-foreground: #818995;
--border: #d7d6d4;
--destructive: #dc2626;
--ring: #3d4a5c;
--radius: 0.5rem;
--font-sans: ui-sans-serif, system-ui, sans-serif;
--font-serif: ui-serif, Georgia, serif;
--font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
--spacing: 1rem;
--shadow: 0 4px 12px rgba(61,74,92,0.06);
}
}