728x90
728x170
Microsoft.Fast.Components.FluentUI.Icons 에서는 각종 기본 아이콘을 제공합니다.
아래 사이트에 가면 제공하는 아이콘들을 확인할 수 있습니다.
https://bennymeg.github.io/ngx-fluent-ui/
사용하는 방법입니다.
1. 'Microsoft.Fast.Components.FluentUI.Icons' Nuget 패키지 설치
2. 화면에서 사용
Icons.Regular 로 시작하는 아이콘은 선만 있으며
Icons.Filled로 시작하는 아이콘은 채워진 아이콘입니다.
@page "/"
@using Microsoft.Fast.Components.FluentUI
<FluentLayout Style="margin-top: 10px;">
<h3>▶ FluentIcon</h3>
<FluentCard Style="margin: 10px;">
<FluentIcon Icon="@(Icons.Regular.Size24.Save)" />
<FluentIcon Icon="@(Icons.Regular.Size24.Delete)" />
<FluentIcon Icon="@(Icons.Regular.Size24.Check)" />
<FluentIcon Icon="@(Icons.Regular.Size24.Add)" />
<br/>
<FluentIcon Icon="@(Icons.Regular.Size48.Building)" />
<FluentIcon Icon="@(Icons.Regular.Size48.Delete)" />
<FluentIcon Icon="@(Icons.Regular.Size48.Checkmark)" />
<FluentIcon Icon="@(Icons.Regular.Size48.Add)" />
<br />
<FluentIcon Icon="@(Icons.Filled.Size48.Building)" />
<FluentIcon Icon="@(Icons.Filled.Size48.Delete)" />
<FluentIcon Icon="@(Icons.Filled.Size48.Checkmark)" />
<FluentIcon Icon="@(Icons.Filled.Size48.Add)" />
</FluentCard>
</FluentLayout>
결과
생각보다 아이콘 종류가 많아서 웬만한 웹페이지 만들 때는 부족함 없이 사용할 수 있을 것 같습니다.
728x90
그리드형
'C#' 카테고리의 다른 글
[C#] Linq Aggregate 사용하기 (0) | 2023.09.26 |
---|---|
[C#] Liquid Template 사용하기 - Fluid (0) | 2023.09.21 |
[C#/Oracle] Oracle Parameter 순서 (0) | 2023.09.19 |
[C#] 필드 필수 처리 - required modifier (0) | 2023.09.17 |
[C#] 리스트 패턴 (List Pattern) (0) | 2023.09.17 |