Icon Design Graphics Icon 4

Question 1

Which SVG attribute controls the coordinate system and viewBox scaling for an icon?

Accepted Answer

viewBox

Answer

The viewBox attribute defines the internal coordinate system of an SVG, enabling it to scale proportionally to any display size.

Question 2

When should a designer use a 'two-tone' icon style rather than a flat monochrome style?

Accepted Answer

When additional visual hierarchy or depth is needed to differentiate parts of the icon

Answer

Two-tone styles use a secondary lighter or transparent color to add depth and help users distinguish different parts of a complex icon.

Question 3

What is the role of 'corner radius' in icon design?

Accepted Answer

It controls the softness or roundness of icon edges, influencing the icon's personality and style

Answer

Corner radius shapes an icon's character—sharper corners feel technical or formal, while rounder corners feel friendly and approachable.

Question 4

What problem does using an icon font (like Font Awesome) solve compared to individual SVG files?

Accepted Answer

Icon fonts allow styling icons with CSS text properties and deliver many icons in a single file

Answer

Icon fonts bundle many icons into a single font file, allowing CSS properties like color, size, and shadow to style them as text glyphs.

Question 5

Which design principle helps ensure an icon remains recognizable when converted to grayscale?

Accepted Answer

Relying on shape and form rather than color alone to convey meaning

Answer

Meaningful shapes allow icons to be understood without color, which is critical for accessibility and monochrome display contexts.

Icon Design Practice Test