How to Create a Price Range Filter in Adobe Illustrator

Learn how to make a stylish price range filter with Illustrator

In the following tutorial you will learn how to create a price range filter which would look great in a mobile phone app or website interface. Andrei Marius will be working in Adobe Illustrator with some basic tools to create an essential element for any designers portfolio.


Open Illustrator and hit Command + N to create a New document. Enter 600 in the width box and 300 in the height box then click on the Advanced button. Select RGB, Screen (72ppi) and make sure that the "Align New Objects to Pixel Grid" box is unchecked before your click OK. Enable the Grid (View > Show Grid) and the Snap to Grid (View > Snap to Grid). You’ll need a grid every 1px. Simply go to Edit > Preferences > Guides > Grid, enter 1 in the Gridline every box and 1 in the Subdivisions box. You can also open the Info panel (Window > Info) for a live preview with the size and position of your shapes. Do not forget to replace the unit of measurement to pixels from Edit > Preferences > Unit > General. Al these options will significantly increase your work speed.


Be the first to write a comment

You must me logged in to write a comment.