Вёрстка сумм

Принципы

Десятичный разделитель — запятая

2,90 ₽

Группы разрядов отбиваются пробелом

Числа делят пробелами на группы по три цифры справа налево.

2 90029 000

Знак размерности отбивается от числа полупробелом

В юникоде он называется – Thin Space. В MacOS найти его можно в панели символов Ctrl + Cmd + Space. В HTML  . Это касается как символов валют, так и других размерностей: %, °C и другие.

2 900 ₽29 000 $

Для отрицательных значений используется минус

«−». Знак от суммы не отбивается. В MacOS найти его можно в панели символов Ctrl + Cmd + Space. В HTML -.

−2 900 ₽

Для положительных значений используется плюс

«+». Это нужно только в некоторых ситуациях, далеко не всегда. Знак от суммы не отбивается.

+29 000 ₽

Сотые значение не отображаются, если их нет

А также никогда не округляются до десятой или целой части.

290 000 ₽ и 290 000,10 ₽10 $ и 10,70 $

Но в ряде продуктов постоянное отображение копеек важно для клиентов. Например, функциональность в Альфа-Бизнес, с которой работают бухгалтеры. В этом случае отсутствие копеек застявляет пользователей сомневаться в банке: всё ли в порядке, не округлил ли банк сумму для визуального удобства.

Стилистика

Для удобства чтения сотые доли числа и знак валюты отделяются от целой части более легким начертанием. Сейчас используем пару Medium и Light.

Исключение составляют экраны, где сумма выводится в одном блоке с другими данными. В этом случае дополнительное оформление излишне.