01. Создаём новый документ нужных нам размеров (в данном примере 48х48 пикселей) - File --> New (или Ctrl+N). С помощью инструмента Rounded Rectangle Tool (U), с параметром radius равный 5, делаем квадрат с закруглёнными углами (ведём от верхнего левого угла к нижнему правому, при этом рекомендуем держать нажатой клавишу Shift). Цвет заполнения не имеет значения.

02. Далее щёлкаем дважды по нашему слою с квадратом (или выбрав Layer --> Layer Style --> Blending Options), и в появившемся окне выбираем Gradient Overlay

Цвет градиента выбираем из нужного нам цвета кнопки.

03. Теперь помещаем на нашу кнопку рисунок (необходимо поместить на новый слой) или текст. В данном случае был использован текст. Дважды кликаем на слое с буквами (или рисунком), и (или Layer --> Layer Style --> Blending Options), и в появившемся окне выбираем Drop Shadow

В результате получится примерно так:

Можно менять параметры, чтобы получился результат нужный Вам.

04. Создаём ещё один слой Layer --> New --> Layer (Shift+Ctrl+N). Снова используем инструмент Rounded Rectangle Tool (U), но уже в режиме Paths (на рисунке ниже отмечен красной рамкой) и радиусом в 3 пикселя:

Снова делаем выделение (нажав Shift), но обязательно в пределах нашей кнопки!. Нажимаем Ctrl+Enter, и с помощью инструмента Gradient Tool (G) заполняем градиентом от белого к прозрачному.

Далее с помощью Rectangular Marquee Tool (M) выделяем нижнюю половину слоя с градиентом, и нажимаем на клавишу Delete.

Теперь осталось для этого слоя выставить прозрачность в пределах 50-60%.

И получаем результат:

Важно! Если используется прозрачный фон (как в данном примере), то сохранить кнопку нужно только в формате PNG-24. В противном случае стоит добавить слой с нужным Вам цветом фона.