首页 > PS教程> 图标设计> Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程
374人在学

[图标设计] Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

先看效果图。

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

新建文档1280x1024像素,背景白色,建新层,填充黑色,添加图层样式。

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

效果如下。

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

建新层,画一个黑色圆角矩形。

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

添加图层样式。

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

效果如下。

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

建新层,用钢笔画出下图所示路径,转为选区填充白色,图层模式叠加,不透明度20%,填充75%。

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

建新层,用矩形工具做如下选区,填充0082f0,去掉选区用柔角橡皮涂抹两端,产生渐隐的效果。

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

添加图层样式。

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

效果如下。

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

建新层,画一黑色箭头。

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

添加图层样式。

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

效果如下。

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

复制一层缩小,改变渐变叠加的颜色。

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

建新层,用钢笔画出下图所示路径,转为选区填充黑色。

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

添加图层样式。

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

效果如下。

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

然后底部建新层做一个阴影,类似下图效果。

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

用上述方法作出其它按钮,最终效果如下。

Photoshop设计漂亮华丽亮眼酷炫的网页按钮教程

文章来源:破洛洛

Copyright © 2016精英秀 京ICP备14060168号-2
返回顶部