Arrow Autofit Height Dotted icon

Used for adjusting content size. Dotted versions are used for autofit. Contains height & width variants. The Arrow Autofit Height Dotted icon is part of Microsoft's Fluent UI System Icons, available here in regular and filled styles in 2 sizes from 20 to 24 px. Download it as SVG or PNG, or copy it as code — it's free to use under the MIT License.

Regular (outlined)

Filled

Xceed 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_arrow_autofit_height_dotted_24_regular.svg

npm install @fluentui/react-icons

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

export function Example() {
  return <ArrowAutofitHeightDotted24Regular aria-label="Arrow Autofit Height Dotted" />;
}

Use the Arrow Autofit Height Dotted 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 { ArrowAutofitHeightDotted24Regular, ArrowAutofitHeightDotted24Filled } from "@fluentui/react-icons";

export function Example() {
  return <ArrowAutofitHeightDotted24Regular aria-label="Arrow Autofit Height Dotted" />;
}

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_arrow_autofit_height_dotted_24_regular.svg" width="24" height="24" alt="Arrow Autofit Height Dotted">

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="M18.7197 17.2197C19.0126 16.9269 19.4874 16.9269 19.7803 17.2197C20.0731 17.5126 20.0731 17.9874 19.7803 18.2803L17.2803 20.7803C17.1396 20.9209 16.9489 21 16.75 21C16.5511 21 16.3604 20.9209 16.2197 20.7803L13.7197 18.2803C13.4269 17.9874 13.4269 17.5126 13.7197 17.2197C14.0126 16.9269 14.4874 16.9269 14.7803 17.2197L16.75 19.1894L18.7197 17.2197ZM11.25 4C11.6642 4 11.9999 4.33584 12 4.75C12 5.16419 11.6642 5.5 11.25 5.5H6.25C5.83582 5.5 5.50006 5.83584 5.5 6.25V17.75C5.50003 18.1642 5.8358 18.5 6.25 18.5H11.25C11.6642 18.5 11.9999 18.8358 12 19.25C12 19.6642 11.6642 20 11.25 20H6.25C5.00737 20 4.00003 18.9926 4 17.75V6.25C4.00006 5.00741 5.0074 4 6.25 4H11.25ZM16.75 14.5C17.1642 14.5 17.4999 14.8358 17.5 15.25V16.25C17.5 16.6642 17.1642 17 16.75 17C16.3358 17 16 16.6642 16 16.25V15.25C16.0001 14.8358 16.3358 14.5 16.75 14.5ZM16.75 11C17.1642 11 17.4999 11.3358 17.5 11.75V12.25C17.5 12.6642 17.1642 13 16.75 13C16.3358 13 16 12.6642 16 12.25V11.75C16.0001 11.3358 16.3358 11 16.75 11ZM16.75 7C17.1642 7 17.4999 7.33584 17.5 7.75V8.75C17.5 9.16419 17.1642 9.5 16.75 9.5C16.3358 9.5 16 9.16419 16 8.75V7.75C16.0001 7.33584 16.3358 7 16.75 7ZM16.2764 3.16797C16.5709 2.92772 17.0057 2.94519 17.2803 3.21972L19.7803 5.71972C20.0731 6.0126 20.0731 6.48738 19.7803 6.78027C19.4874 7.07313 19.0126 7.07313 18.7197 6.78027L16.75 4.81054L14.7803 6.78027C14.4874 7.07313 14.0126 7.07313 13.7197 6.78027C13.4269 6.48738 13.4269 6.0126 13.7197 5.71972L16.2197 3.21972L16.2764 3.16797Z" fill="currentColor"/></svg>

Details

Name	Arrow Autofit Height Dotted
Styles	Regular (outlined), Filled
Sizes	20 px, 24 px
Regular (outlined) file	`ic_fluent_arrow_autofit_height_dotted_24_regular.svg`
Filled file	`ic_fluent_arrow_autofit_height_dotted_24_filled.svg`
React (Regular)	`ArrowAutofitHeightDotted20Regular, ArrowAutofitHeightDotted24Regular`
React (Filled)	`ArrowAutofitHeightDotted20Filled, ArrowAutofitHeightDotted24Filled`
License	MIT (© Microsoft Corporation)

Keywords

width height resize fill

Arrow Autofit Height Dotted icon

Every size and style