s01s1/2018 '5 Creative Divi Button Module Designs & How to Make Them | Elegant Themes Slog ie ec) o o x Data stored as outlined in our Privacy Policy Since the left box shadow is flush against the start of the arrow icon, this creates a nice arrow border effect If for some reason it doesnt sit flush against the icon, you can adjust the horizontal position as needed. The beauty of this design is that the left arrow border will remain in place even when adding different amounts of button text. Here is the final result. GET STARTED tps uw oleganttnemes.comvblogiciv-resoutceslalv-butlor-module-dosigns 8138s01s1/2018 '5 Creative Divi Button Module Designs & How to Make Them | Elegant Themes Slog tton Conrezomuon ick Here > Data stored as outlined in our Privacy Policy Hig Hunt wusur sue rue More of a technical and minimalist feel. The lines are created using a box shadow and a background gradient separated by a transparent border. I've also added a hover effect that moves the box shadow to the right which in turn moves the bottom line slightly to the right for a subtle interaction. To start, create a new section with a one column row and add a button module to the row. Update the button text content to whatever you want. I'm leaving the default “click here” for this example. Then update the design settings as follows: * Use Custom Styles for Button: YES * Button Text color: #3b7986 * Button Background Gradient Left Color: rgba(255,255,255,0) * Button Background Gradient Right Color: #3b7986 30deg tps sw oleganttnemes.comvblogiciv-resoutceslalv-butlor-module-dosigns 738s01s1/2018 '5 Creative Divi Button Module Designs & How to Make Them | Elegant Themes Slog Conresomuon 0px rgba(0,0,0,0) 8: 0px g: 6px Data stored as outlined in our Privacy Policy © Font weignt: Bora * Font Style: Tt (small caps) * Button Icon: Right Arrow (see screenshot) * Only Show Icon on Hover for Button: NO * Custom Padding: 0px Bottom * Box Shadow: see screenshot * Box Shadow Horizontal Position:-15px * Box Shadow Vertical Positon: 15px * Box Shadow Spread Strength: -13px * Shadow Color: #3b7986 tps sw oleganttnemes.comvblogiciv-resoutcesial-butlor-module-dosigns 8138