เทมเพลตปุ่ม“ กระตุ้นให้ดำเนินการ” 30+ ขึ้นไปสำหรับดาวน์โหลด

แทบจะไม่มีเว็บไซต์ใด ๆ ที่ไม่มีปุ่มสองชนิดคือ ปุ่มโซเชียลมีเดียและปุ่มกระตุ้นการตัดสินใจ ในขณะที่อดีตเป็นหัวข้อที่แตกต่างกันโดยสิ้นเชิงในโพสต์นี้ฉันมี เทมเพลตปุ่มกระตุ้นให้ดำเนินการเพื่อดาวน์โหลด.

ในขณะที่นักออกแบบเว็บไซต์มักมองหาคอลเลกชันใหม่ของปุ่มเรียกร้องให้ดำเนินการที่นี่คือชุดของเทมเพลตปุ่มเรียกร้องให้ดำเนินการตั้งแต่ HTML, CSS และ JavaScript เพื่อออกแบบรูปแบบ Photoshop อย่างมืออาชีพ. ลองมาดูกัน.

หมายเหตุจากบรรณาธิการ: โพสต์นี้ถูกเผยแพร่ครั้งแรกในเดือนสิงหาคม 2014 และได้รับการปรับปรุงในเดือนมีนาคม 2018 บนพื้นฐานของเนื้อหาใหม่โดย Ashutosh KS.

ปุ่มต่างๆใน HTML / CSS / JS

ปุ่ม Floaty แฟนซี

หากคุณกำลังมองหาวิธีที่สนุกในการแสดงรายการที่สามารถดำเนินการได้ปุ่มแฟนซีโฟลตตี้จะฟังดูเหมือนตัวเลือกที่เหมาะ มันแสดงให้เห็นง่าย ปุ่มสีที่ลอยด้วยการขึ้นและลงอย่างช้าๆ. คุณสามารถเปลี่ยนเนื้อหาและการออกแบบได้ตามต้องการ.

ปุ่ม RubyMotion CTA

ปุ่ม RubyMotion CTA เป็นปุ่มเรียกร้องให้ดำเนินการที่สวยงามและน่าดึงดูดใจด้วยสีที่มีชีวิตชีวา ฉันชอบ ภาพเคลื่อนไหวบนโฮเวอร์, ซึ่งเติมปุ่มทั้งหมดด้วยสี.

Pulsing CTA

เทมเพลตนี้แสดงให้เห็นได้ง่าย ปุ่มเรียกร้องให้ดำเนินการที่มีพื้นหลังเป็นจังหวะ. ด้วยลักษณะที่เต้นเป็นจังหวะทำให้สังเกตเห็นได้ชัดเจนพอที่จะดึงดูดความสนใจของผู้เข้าชมทุกคน.

ปุ่ม Flip-down Call to Action

Button Flip-down Call to Action เป็นเทมเพลตปุ่มแบบเรียกร้องให้ดำเนินการที่มีปุ่ม ภาพเคลื่อนไหวพลิกที่ดูเหมือนว่ากล่องจดหมายกำลังเปิด. เนื่องจากภาพเคลื่อนไหวนี้ฉันชอบปุ่มนี้.

หกปุ่มพร้อมภาพเคลื่อนไหวโฮเวอร์

ชุดนี้หก ปุ่มที่มีภาพเคลื่อนไหวแบบโฮเวอร์ต่าง ๆ เป็นชุดที่สมบูรณ์แบบของปุ่มเรียกร้องให้ดำเนินการหากคุณกำลังมองหาสถานที่ที่แตกต่างกันและทำให้เป็นเอกลักษณ์.

คำกระตุ้นการตัดสินใจของ YouTube

หากคุณต้องการแสดงวิดีโอหรือลิงค์โปรโมชั่นเป็นคำกระตุ้นการตัดสินใจการโทรเข้าสู่ YouTube คือทางเลือกที่เหมาะสมที่สุด มันโชว์ผลงาน ปุ่มทำความสะอาดและมองเห็นได้ซึ่งแสดงข้อมูลเพิ่มเติมเกี่ยวกับโฮเวอร์, และคุณสามารถปรับแต่งสีเพื่อให้โดดเด่นพร้อมกับการออกแบบของคุณ.

ปุ่มเคลื่อนไหววัสดุการออกแบบ

การออกแบบวัสดุปุ่มเคลื่อนไหวนำความเรียบง่ายของการออกแบบวัสดุในปุ่มเรียกร้องให้ดำเนินการ มันแสดงให้เห็น ปุ่มสี่ปุ่มพร้อมการออกแบบที่หลากหลายและเอฟเฟกต์ระลอกคลื่น.

ปุ่มโต้ตอบไมโคร

เทมเพลตปุ่มการเรียกร้องให้ดำเนินการที่สวยงามและโต้ตอบได้ปุ่ม Micro Interaction Button แสดงการออกแบบที่สะอาดตา แสดงข้อความของปุ่มพร้อมกับไอคอน. แม้ว่าเทมเพลตนี้จะแสดงไอคอนบนโฮเวอร์ แต่คุณสามารถปรับแต่งเพื่อเพิ่มเนื้อหาอื่น ๆ ได้เช่นกัน.

ภาพเคลื่อนไหวของปุ่ม CTA ที่แข็งแกร่ง

ภาพเคลื่อนไหวของปุ่ม CTA ที่แข็งแกร่งแสดงปุ่มหลายปุ่มในสีที่ต่างกัน ฉันชอบปุ่มของมันธรรมดาและ การออกแบบที่เรียบง่ายพร้อมเอฟเฟกต์การเปลี่ยนแปลงบนพื้นหลัง สี.

CTA หลัก

ปุ่มเรียกร้องให้ดำเนินการที่คุณชื่นชอบที่คุณเห็นทุกที่บนเว็บ นี้ เทมเพลตที่ใช้ CSS ยังอธิบายรายละเอียดการออกแบบขั้นพื้นฐาน สำหรับการสร้างปุ่มที่แปลง.

การทดลองเรียกร้องให้ดำเนินการ

การเรียกร้องให้ดำเนินการทดลองเป็นอีกปุ่มหนึ่งที่ตั้งค่าไว้เช่นปุ่มโต้ตอบขนาดเล็ก มันแสดงให้เห็น ข้อความในโหมดปกติและแสดงไอคอนในโหมดโฮเวอร์. เช่นเดียวกับปุ่มอื่น ๆ คุณสามารถปรับแต่งเพื่อแสดงเนื้อหาใด ๆ เพื่อปรับปรุงการโต้ตอบ.

ปุ่มต่างๆใน Photoshop PSD

ชุดปุ่ม Web 2.0

มันเป็นชุดที่สวยงามของปุ่มเรียกร้องให้ดำเนินการหลายอย่างรวมถึง สมัคร, ดาวน์โหลด, อ่านปุ่มเพิ่มเติม, มันแสดงปุ่มเหล่านี้ในรูปแบบและสีที่หลากหลายช่วยให้คุณสามารถเลือกปุ่มที่เหมาะสมกับแบรนด์และการออกแบบของคุณเพื่อประสิทธิภาพ.

ปุ่ม CALL-TO-ACTION

ปุ่ม CALL-TO-ACTION เป็นปุ่มที่ง่ายและน่าสนใจสำหรับการแสดงรายการที่สามารถดำเนินการได้ มันโชว์ผลงาน การออกแบบรอบกับพื้นหลังไล่ระดับสี.

ปุ่มเรียกร้องให้ดำเนินการ

ชุดปุ่มสามสีปุ่มเรียกร้องให้ดำเนินการแสดงปุ่มดาวน์โหลดใน สามสีที่แตกต่างและสองโหมด - ปกติและกด (คลิก) นอกจากนี้คุณยังสามารถปรับเปลี่ยนปุ่มเพื่อแสดงการกระทำที่แยกต่างหากในขณะที่ยังคงการออกแบบของปุ่ม.

ปุ่มสีเขียวขนาดใหญ่ (PSD)

ปุ่มสีเขียวขนาดใหญ่โชว์ผลงาน ปุ่มเรียกร้องให้ดำเนินการปุ่มใหญ่ ที่สมบูรณ์แบบสำหรับการแสดงข้อมูลเพิ่มเติมหรือข้อความพร้อมกับรายการที่ดำเนินการได้เช่นข้อมูลการกำหนดราคา.

ปุ่มโทรเพื่อดำเนินการฟรี

ปุ่มโทรเพื่อกระตุ้นการทำงานฟรี ปุ่มลงทะเบียนในหลายขนาดและหลายสี. แม้ว่าการออกแบบของพวกเขาจะเหมือนกัน แต่ความหลากหลายของพวกเขาช่วยในการเลือกหนึ่งที่ดีที่สุดตามความต้องการ.

ชุดปุ่มนักออกแบบเว็บไซต์

เทมเพลตปุ่มกระตุ้นการตัดสินใจนี้แสดงปุ่มหลายแบบพร้อมการจัดแสดง ปุ่มกลมปุ่มกลมและปุ่มวงกลมขนาดเล็ก. ในชุดนี้คุณสามารถสังเกตเห็นเอฟเฟกต์ของเงาและเส้นขอบต่าง ๆ และเลือกอันที่เหมาะสม.

เรียกร้องให้ดำเนินการ Butttons

Call to Action Butttons เป็นเทมเพลตอย่างง่ายที่แสดงปุ่มหลายปุ่มที่มีรูปร่างแตกต่างกันและพื้นหลังไล่ระดับสีต่าง ๆ ชุดแสดงให้เห็น ขนาดของปุ่มมากมายและรวมถึงไอคอน เช่นกันตามแนวโน้มปัจจุบันของปุ่มไอคอนข้อความสุดยอด.

ปุ่มเรียกร้องให้ดำเนินการ PSD

ปุ่มเรียกร้องให้ดำเนินการ PSD เป็นเทมเพลตที่แสดง ปุ่มรวมสองปุ่มสำหรับการสร้างปุ่มกลุ่มที่ใช้งานได้. เทมเพลตมีไอคอนลบข้อความในปุ่มและแสดงชุดปุ่มที่มีขอบวงกลมและสองสถานะหรือโหมด - ปกติและคลิก.

ไฟล์ PSD ของปุ่มเรียกร้องให้ดำเนินการ

เทมเพลตปุ่มนี้เหมือนกับปุ่มด้านบนแสดงปุ่มที่มีไอคอนลบข้อความพื้นหลังไล่ระดับสีและเส้นขอบที่โค้งมนในสถานะปกติรวมถึงสถานะโฮเวอร์.

ดาวน์โหลด + อัพโหลดปุ่ม PSD

ดาวน์โหลด + อัปโหลดปุ่ม PSD แสดงของขวัญ ปุ่มสามชุดในสองสีและการออกแบบ. แม้ว่าเทมเพลตจะแสดงปุ่มอัปโหลดและดาวน์โหลด แต่คุณสามารถแก้ไขได้ตามความต้องการของคุณ นอกจากนี้มันยังแสดงปุ่มต่างๆ โฮเวอร์และสถานะที่ไม่ใช่โฮเวอร์.

ปุ่ม CTA

ปุ่ม CTA แสดงปุ่มเรียกร้องให้ดำเนินการสามชุดในสีที่ต่างกัน ปุ่มถูกกำหนดให้เป็นตัวหนาและ แสดงสไตล์ในสองโหมดที่แตกต่างกัน - ปกติเช่นเดียวกับโฮเวอร์.

เรียนรู้เพิ่มเติมปุ่ม

เรียนรู้เพิ่มเติมปุ่มโชว์ผลงาน ปุ่มเรียนรู้เพิ่มเติมคือสามสไตล์ที่แตกต่าง - ปกติโฮเวอร์และแอ็คทีฟ / คลิก ปุ่มเหล่านี้มีข้อความ (“เรียนรู้เพิ่มเติม”) และไอคอน แต่คุณสามารถเปลี่ยนเนื้อหาให้เหมาะกับความต้องการของแบรนด์หรือไซต์ของคุณได้.

ชุดปุ่มฟรี

ชุดปุ่มฟรีแสดงปุ่มหลายปุ่มในสีที่ต่างกัน - สว่างและมืด - เพื่อให้เหมาะกับโทนสีหรือธีมต่างๆ มีห้าปุ่มในแม่แบบนี้ด้วยการออกแบบที่แตกต่างกันแสดง ไอคอนป้ายและข้อความในสไตล์ที่แตกต่าง, ในสถานที่ต่าง ๆ.