Fluent Icons

Glance Horizontal icon

Used in tile card scenarios. Contains directional variants. The Glance Horizontal icon is part of Microsoft's Fluent UI System Icons, available here in regular and filled styles in 7 sizes from 12 to 48 px. Download it as SVG or PNG, or copy it as code — it's free to use under the MIT License.

Regular (outlined)

SVG

Filled

SVG
Xceed Toolkit Plus for WPF logoXceed Toolkit Plus for WPFSponsorUpgrade Your WPF UI with Xceed Toolkit Plus

Every size and style

Microsoft draws each size separately so icons stay crisp, rather than scaling one drawing. Pick a style and size to preview it, download it, or copy the code for your platform.

Regular, 24 px

ic_fluent_glance_horizontal_24_regular.svg

Glance Horizontal icon in React

npm install @fluentui/react-icons

import { GlanceHorizontal24Regular } from "@fluentui/react-icons";

export function Example() {
  return <GlanceHorizontal24Regular aria-label="Glance Horizontal" />;
}

Glance Horizontal icon in SVG

npm install @fluentui/svg-icons

import icon from "@fluentui/svg-icons/icons/glance_horizontal_24_regular.svg";

<!-- or load it from a CDN -->
<img src="https://cdn.jsdelivr.net/npm/@fluentui/svg-icons@1.1.341/icons/glance_horizontal_24_regular.svg" width="24" height="24" alt="Glance Horizontal">

Glance Horizontal icon in Blazor

Microsoft's Fluent UI Blazor icons package:

dotnet add package Microsoft.FluentUI.AspNetCore.Components.Icons

<FluentIcon Value="@(new Icons.Regular.Size24.GlanceHorizontal())" />

Glance Horizontal icon in Flutter

flutter pub add fluentui_system_icons

import 'package:fluentui_system_icons/fluentui_system_icons.dart';

Icon(FluentIcons.glance_horizontal_24_regular)

Glance Horizontal icon in WinUI / WPF

Add FluentSystemIcons-Regular.ttf from Microsoft's repository to your app, then use the glyph:

<!-- WinUI 3 (font in Assets/Fonts) -->
<FontIcon FontFamily="ms-appx:///Assets/Fonts/FluentSystemIcons-Regular.ttf#FluentSystemIcons-Regular" Glyph="&#xE6A8;" FontSize="24" />

<!-- WPF (font in Fonts/, Build Action: Resource) -->
<TextBlock FontFamily="pack://application:,,,/Fonts/#FluentSystemIcons-Regular" Text="&#xE6A8;" FontSize="24" />

Glance Horizontal icon in Icon font

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/microsoft/fluentui-system-icons@9cf8af0f95a555918a60b8147a2f33a6a1248442/fonts/FluentSystemIcons-Regular.css">

<i class="icon-ic_fluent_glance_horizontal_24_regular"></i>

/* or use the code point in your own CSS */
.icon::before {
  font-family: "FluentSystemIcons-Regular";
  content: "\e6a8";
  font-size: 24px;
}

Glance Horizontal icon in Android

// build.gradle
implementation("com.microsoft.design:fluent-system-icons:1.1.341@aar")

<!-- layout XML -->
<ImageView android:src="@drawable/ic_fluent_glance_horizontal_24_regular" />

// Kotlin
R.drawable.ic_fluent_glance_horizontal_24_regular

Glance Horizontal icon in iOS

# Podfile
pod "FluentIcons", "1.1.341"

import FluentIcons

UIImage(fluent: .glanceHorizontal24Regular)

Glance Horizontal icon in Power Apps

Paste into an Image control's Image property. The Copy button copies the full formula with this icon's SVG.

"data:image/svg+xml;utf8, " & EncodeUrl("<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'>…</svg>")

Use the Glance Horizontal icon in React

Install Microsoft's @fluentui/react-icons package, then import the component. Icons inherit the current text color, and you can size them with CSS. 

npm install @fluentui/react-icons

import { GlanceHorizontal24Regular, GlanceHorizontal24Filled } from "@fluentui/react-icons";

export function Example() {
  return <GlanceHorizontal24Regular aria-label="Glance Horizontal" />;
}

Coding agents can look up this component through the Fluent Icons MCP server.

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_glance_horizontal_24_regular.svg" width="24" height="24" alt="Glance Horizontal">

Or paste the SVG markup inline. Setting fill="currentColor" makes the icon follow the text color of its parent: 

<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.001 4.75195C13.001 3.78545 12.2175 3.00195 11.251 3.00195H4.75098C3.78448 3.00195 3.00098 3.78545 3.00098 4.75195V9.25195C3.00098 10.2185 3.78448 11.002 4.75098 11.002H11.251C12.2175 11.002 13.001 10.2185 13.001 9.25195V4.75195ZM8.98856 14.7338C8.98856 13.7673 8.20506 12.9838 7.23856 12.9838H4.75098C3.78448 12.9838 3.00098 13.7673 3.00098 14.7338V19.2482C3.00098 20.2147 3.78448 20.9982 4.75098 20.9982H7.23856C8.20506 20.9982 8.98856 20.2147 8.98856 19.2482V14.7338ZM11.501 4.75195V9.25195C11.501 9.39002 11.389 9.50195 11.251 9.50195H4.75098C4.61291 9.50195 4.50098 9.39002 4.50098 9.25195V4.75195C4.50098 4.61388 4.61291 4.50195 4.75098 4.50195H11.251C11.389 4.50195 11.501 4.61388 11.501 4.75195ZM7.48856 14.7338V19.2482C7.48856 19.3862 7.37663 19.4982 7.23856 19.4982H4.75098C4.61291 19.4982 4.50098 19.3862 4.50098 19.2482V14.7338C4.50098 14.5957 4.61291 14.4838 4.75098 14.4838H7.23856C7.37663 14.4838 7.48856 14.5957 7.48856 14.7338ZM21.0027 14.7482C21.0027 13.7817 20.2192 12.9982 19.2527 12.9982H12.7527C11.8345 12.9982 11.0815 13.7053 11.0085 14.6046L11.0027 14.7482V19.2482C11.0027 20.2147 11.7862 20.9982 12.7527 20.9982H19.2527C20.2192 20.9982 21.0027 20.2147 21.0027 19.2482V14.7482ZM19.5027 14.7482V19.2482C19.5027 19.3862 19.3907 19.4982 19.2527 19.4982H12.7527C12.6146 19.4982 12.5027 19.3862 12.5027 19.2482V14.7482L12.5093 14.6908C12.5352 14.5804 12.6343 14.4982 12.7527 14.4982H19.2527C19.3907 14.4982 19.5027 14.6101 19.5027 14.7482ZM21.0027 4.75195C21.0027 3.78545 20.2192 3.00195 19.2527 3.00195H16.7527C15.7862 3.00195 15.0027 3.78545 15.0027 4.75195V9.25195C15.0027 10.2185 15.7862 11.002 16.7527 11.002H19.2527C20.2192 11.002 21.0027 10.2185 21.0027 9.25195V4.75195ZM19.5027 9.25195C19.5027 9.39002 19.3907 9.50195 19.2527 9.50195H16.7527C16.6146 9.50195 16.5027 9.39002 16.5027 9.25195V4.75195C16.5027 4.61388 16.6146 4.50195 16.7527 4.50195H19.2527C19.3907 4.50195 19.5027 4.61388 19.5027 4.75195V9.25195Z" fill="currentColor"/></svg>

Details

NameGlance Horizontal
StylesRegular (outlined), Filled
Sizes12 px, 16 px, 20 px, 24 px, 28 px, 32 px, 48 px
Regular (outlined) fileic_fluent_glance_horizontal_24_regular.svg
Filled fileic_fluent_glance_horizontal_24_filled.svg
React (Regular)GlanceHorizontal12Regular, GlanceHorizontal16Regular, GlanceHorizontal20Regular, GlanceHorizontal24Regular, GlanceHorizontal28Regular, GlanceHorizontal32Regular, GlanceHorizontal48Regular
React (Filled)GlanceHorizontal12Filled, GlanceHorizontal16Filled, GlanceHorizontal20Filled, GlanceHorizontal24Filled, GlanceHorizontal28Filled, GlanceHorizontal32Filled, GlanceHorizontal48Filled
LicenseMIT (© Microsoft Corporation)

Keywords

card

Related icons

Glance Horizontal SparklesGlance Horizontal SparkleGlanceAlign Center HorizontalAlign End HorizontalAlign Space Around HorizontalAlign Space Between HorizontalAlign Space Evenly HorizontalAlign Start HorizontalAlign Stretch HorizontalCenter HorizontalData Bar Horizontal