Post card — Design Pack Atlas

Post card

글 카드

Tiles are plain grey with no rounded corners or border, and a blue arrow at the bottom right. The variants are rows divided by rules (list), a tile with the post’s diagram cropped on top (thumb), and a big thin-numeral row (number).

RuleThe whole card is clickable, but the title is the only link. Posts without a picture never get an invented one.

Also known as: PostCard

--- // design-systems/krds/components/PostList.astro // PostCard 은 이 파일 안에서 쓰인다(팩 구현끼리) --- <PostCard post={post} variant={variant} index={i + 1} headingLevel={cardLevel} showCategory={showCategory} />

export interface PostCardProps { post: PostSummary; headingLevel?: 2 | 3; showCategory?: boolean; /** number 변형의 순번(1부터) */ index?: number; /** 홈 대표 글처럼 크게 */ lead?: boolean; variant?: VariantOf<'PostCard'>; }

list keeps topic label, bold title, a two-line description and the date in one row with a thin rule below. thumb shows the post’s first diagram, cropped, at the top of a grey tile, then title and description, with a blue arrow at the bottom right; a post without a diagram becomes a text-only tile. number puts a large thin ordinal beside title and date only, so it is dense with no description. The large tile at the bottom is the featured post (lead).

In thumb the picture takes about half the card but the diagram is cut midway, so you cannot read all of it. For many posts scanned quickly, number or list work well. The picture is a diagram from the post, not a photo, so it never gets as showy as a photo-led site.

Use it when — Variants 3

listList When readers should choose by reading the blurb — topic, title, blurb, date.Used by 2: birthprep, milestone
thumbThumbnail When many posts have diagrams — the post’s first diagram, small (text only if there is none).Used by 4: babysick, babysleep, toddlerfood, 허브
numberNumber When there are many posts to show densely, or a series meant to be read in order.Used by 5: babyfood, babyplay, feeding, newborn, vaccination

Same component, other packs

18Post card글 카드

18Post card글 카드

18Post card글 카드

Use it when — Variants 3