Build a Profile Card with Compose Desktop: Layouts & Styling | Kotlin Desktop Lesson 02

Learn how to build a polished profile card using Compose Desktop layouts and styling! In this lesson we explore Column, Row, and Box layouts, chain Modifiers for sizing and clipping, style Text with font weight and line height, and use Material3 Card, Divider, and Button components. What You'll Learn: - Column, Row, and Box layout composables - Modifier chains: size, padding, clip, background, fillMaxWidth - CircleShape and RoundedCornerShape for clipping - Text styling: fontSize, fontWeight, lineHeight, textAlign - Material3 Card with custom colors and elevation - Divider for visual separation - Arrangement.SpaceEvenly for distributing items - Custom color palette with Color() - Extracting reusable composables (StatItem) Timestamps: 0:00 - Introduction 0:15 - Preview: What We're Building 0:45 - Project Setup (from scratch) 2:15 - Layout Basics: Card, Column, Row 3:45 - Styling & Modifiers 4:45 - Live Demo: Profile Card 5:45 - Recap & Key Takeaways 6:45 - End Screen Key Takeaways: 1. Layouts — Column stacks vertically, Row horizontally, Box layers on top 2. Modifiers — Chain .size, .clip, .background, .padding for styling 3. Card Component — Elevation, rounded corners, and container colors 4. StatItem Pattern — Extract reusable composables with parameters 5. Text Styling — fontSize, fontWeight, lineHeight, textAlign control typography