Skip to content Skip to sidebar Skip to footer

10 Basic Elements of Design as The Starting Point

The world of design is very tempting but not as simple as it seems. Creativity will not be enough, you need logic and even basic mathematical knowledge. If you are new to design or just want to understand more about this issue to distinguish a good designer from a non-professional, then you should start with the basic elements of design.

These things are fundamental in the design and affect the perception of the project. Most likely you have faced the fact that all seems to be not bad, but something is missing. Everything seems to be attractive, but at the same time, something looks wrong. All this can arise not because of a lack of creativity, but because of neglect of the basic rules. Let’s look at 10 basic elements of design without which your website will not work or will be of bad quality.


You probably perfectly understand that color plays one of the key roles in design. The wrong combination of colors can simply ruin the whole design, despite the fact that all other basic elements of design placed right.

What is the best? The harmony of color, which means a combination of colors that is aesthetically pleasing to the eye. If you observe this harmony, then you can get a positive result regarding any project. Beginning designers use the color wheel to correctly compose the following sets of colors:

  • Triad. You must select one primary color and two that are at the same distance from the primary. Well, then engage in the selection of shades.
  • Monochrome. You must select one primary color and two shades of it. For example, blue, light blue and navy blue. This combination is ideal for beginners in design!

Brightness or Tone

With this element, you can draw attention to some vital objects. And you just cannot do without paying attention to design. Design is not only aesthetic beauty but even an impulse to the action!

For example, if you add dark elements to the light background, then they will be striking. If the background is dark, then everything works the other way around. At first glance, everything seems elementary, but in fact, many designers can play with this element for a very long time. The main thing is to follow the light-dark rule and take into account the rules from the above element.

Using a gradient gives a very good effect since you can create depth and volume. Also, remember that you can achieve the same effect with shadows and glows.


The texture is the element that conveys surfaces in any design figure. With this element, you can achieve tactility and the illusion of depth. But note that although this element is basic, it is not always used. For example, there is such a direction as Flat-design, a feature of which is that all elements are flat and texture is not applied.

Thanks to the texture, you can create both tactile and visual effects (softness, shine, wood, fur, glass and so on).


We will not focus on what a figure is since the definition has a direct meaning. It is worth paying attention that the figures can be both geometric, curvilinear, negative and positive.

  • Geometric: circle, oval, square, triangle, rhombus and so on.
  • Curved: drop, animal, cloud (arbitrary shape).
  • Positive: a simple figure on the background.
  • Negative: a figure cut out of the background or located in another figure.

This section uses to divide the space between the objects. The figures in the design generate unity and harmony.


This element follows from the previous ones. This is the total mass of figures and how they interact with each other. All the basic elements of design must be in balance. For this reason, they create a WireFrame where you can place all the objects. On a black and white sketch, it becomes visible how to achieve and check the balance among the objects.


This is the empty distance among objects. This applies to text, images, and so on. If you do not observe the distance, then the eye will very quickly get tired.

Also, using space, you can highlight important objects. When everything is stuck, it irritates the eye. Moreover, when there is space, all information will be cleared. But it is important to remember that you should not make too great distances, as this will also harm the design.


Lines, as well as space, are also responsible for focusing attention on important elements. Lines also serve as boundaries for placing information.

This element is simple, punctured, curly, and so on. For example, if you place a small icon between the lines, then the icon will attract attention.


Of course, such an element as a font is significant. Firstly, the font is responsible not only for the general appearance but can also convey the mood and is responsible for the conveniency of perception for the reader. 

One or two fonts that are contrasting are often used. Remember to use additional fonts (italics, decorative and so on). For example, for printing, it is better to use a serif font, and for web projects, it is reasonable to choose fonts without serifs. With a font, you need to consider line spacing to achieve readability. In this case, consider the size of the characters.


For many designers, choosing the right size is a challenge. After all, this element applies to both images, font, and space. Size allows you to draw attention and prioritize. It is especially important to find a balance for the content.

Also, you should take symmetry and asymmetry into account when choosing the size.

Let’s Conclude

Of course, this is not the complete list of significant components that you must consider in the design. But if you are a novice, then without these basic things and accepting of their features, you will not be able to advance in this area. And if you just want to get your eyes on good design, you should also rely on these elements. 

For the Updates

Exploring ideas at the intersection of design, code, and technology. Subscribe to our newsletter and always be aware of all the latest updates.

Leave a comment

Subscribe to our newsletter and always be aware of all the latest updates. Check Privacy Policy ?

ThemeREX © 2020. All rights reserved.

ThemeREX © 2020. All rights reserved.

Download a Free Theme