Skip to content

Instantly share code, notes, and snippets.

@fnky
Created January 10, 2015 02:24
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save fnky/65a58d922509b58ae293 to your computer and use it in GitHub Desktop.
Save fnky/65a58d922509b58ae293 to your computer and use it in GitHub Desktop.
Math Equations for Designers

Math Equations for Designers

This is a collection of mathmatic equations that has helped me in a variety of design projects.

Calculate the size of an area, given the amount of objects and their sizes

Given the amount of objects, and their width or height (e.g. in pixels) we can calculate the width or height of an area that these objects fit in.

amount × size = area

Taking gutters/margins into account

amount × (size + gutter) = area

Calculate amount of objects that can fit in an area, given sizes

Given the width or height of an area we can retrieve the amount of objects that can fit in that area, including their widths or heights.

area ÷ size = amount

Taking gutters/margins into account

area ÷ (size + gutter) = amount

Substracting or adding to the result of (size + gutter) helps us to deal with leading and trailing gutters. If we'd like to omit leading and/or trailing gutters, we simply substract or add it from the result of the size with gutter

area ÷ (size + gutter) ÷ (leading + trailing) = amount
amount × (size + gutter) ÷ (leading + trailing) = area
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment