Question 1

How do I use this icon in React, Vue, or Svelte?

Accepted Answer

Copy ready-to-use component code for React, Vue, Svelte, or raw SVG

Question 2

How do I download this icon in different formats?

Accepted Answer

Download the icon in SVG, PNG, WebP, JPEG, or ICO formats

Question 3

What is the license for this icon?

Accepted Answer

This icon is licensed under ISC

Question 4

Where is this icon commonly used?

Accepted Answer

In modern platforms like Sketch's distribution tools or CSS flexbox space-between with justify-content end utilities, you'll see this icon when users need to create layouts that emphasize the right side while maintaining proportional spacing. It appears in layout control panels during object arrangement, or in design systems where developers need to achieve right-weighted distribution for action-oriented interfaces, call-to-action sections, or navigation elements.

Question 5

What does this icon communicate to users?

Accepted Answer

From a layout flow perspective, the end-distributed pattern communicates more than just 'horizontal spacing' - it specifically indicates directional emphasis that guides user attention toward the right edge where important actions typically reside. This directional emphasis helps in interface design workflows where users need to create visual momentum and guide user interaction toward specific areas.

Question 6

How do I implement this icon?

Accepted Answer

This icon works effectively in design system implementations where it triggers end-aligned distribution for interface elements. Combine it with shadcn/ui's Flex components with justify-end utilities or layout systems requiring right-weighted distribution. The end distribution indicators require clear visual distinction to differentiate end-aligned distribution from centered or start-aligned spacing options.

Align Horizontal Distribute End Icon

Frequently Asked Questions

Similar Icons