Steven Thewissen은 2025년의 MAUI UI July 시리즈 일부로, Tailwind CSS의 유틸리티 스타일 방식을 .NET MAUI에 도입한 실험 프로젝트 “Crosswind”를 소개합니다 유튜브+5thewissen.io+5GoForGoldman+5. CSS 스타일링은 .NET MAUI에서 제한적이며, XAML 기반 스타일이 일반적입니다. 이에 저자는 Tailwind의 클래스 기반 스타일링을 .NET MAUI에서 활용할 수 있도록 StyleClass
시스템을 활용해 border, spacing, sizing, typography 등 다양한 유틸리티 클래스를 구현했으며, .Init()
호출만으로 앱 전반에 적용 가능하도록 설계했습니다 thewissen.io.
또한, Tailwind의 사용자 정의 기능을 Crosswind에서도 지원하여, 간격, 색상 팔레트, 폰트 등을 커스터마이즈할 수 있습니다. 기본 네이밍은 Tailwind 스타일을 따르며, 설정값에 따라 유연하게 확장 가능하도록 구현되었습니다 thewissen.io.
기본 StyleClass
와 XAML의 기존 스타일 시스템 (StaticResource, DynamicResource)과 통합도 고려되어, Crosswind 내 변수들이 리소스 딕셔너리로 자동 등록됩니다. 예를 들어 m-2
클래스 값을 {StaticResource cw_spacing_2}
로 접근할 수 있으며, 기존 스타일 방식을 보완하며 혼용해서 사용할 수 있습니다 thewissen.io.
최종적으로 .NET MAUI 스타일링 방식의 한계를 인정하면서도, Crosswind는 일관된 스타일 구성과 빠른 UI 개발을 가능케 하는 실험적 접근입니다. 제한은 있지만 특히 일관된 가독성과 생산성 향상을 원하는 개발자에게 유익할 수 있다는 평가로 마무리합니다 thewissen.io.
필요하시면 더 자세한 코드 예시나 Crosswind 설치 방법도 도와드릴게요!