Business card redesign: green theme, modern fonts (Poppins/Inter)

This commit is contained in:
John Loper II
2026-06-11 12:41:37 -04:00
parent 414e34f96d
commit ad5c224676
4 changed files with 23 additions and 24 deletions
Binary file not shown.

Before

Width:  |  Height:  |  Size: 440 KiB

After

Width:  |  Height:  |  Size: 96 KiB

+12 -12
View File
@@ -14,32 +14,32 @@
<rect x="0" y="0" width="850" height="12" fill="url(#accentBar)"/>
<!-- Brand name (smaller) -->
<text x="425" y="65" font-family="'Oswald', sans-serif" font-size="36" font-weight="700" fill="#1E3F8A" text-anchor="middle" letter-spacing="2">LOPERBOYS</text>
<text x="425" y="65" font-family="'Poppins', 'Montserrat', 'Segoe UI', sans-serif" font-size="36" font-weight="700" fill="#1B5E20" text-anchor="middle" letter-spacing="2">LOPERBOYS</text>
<!-- Divider -->
<line x1="250" y1="80" x2="600" y2="80" stroke="#2E5BBA" stroke-width="1.5"/>
<line x1="250" y1="80" x2="600" y2="80" stroke="#C8E6C9" stroke-width="2"/>
<!-- Contact Info - centered -->
<!-- Phone -->
<text x="425" y="145" font-family="'Roboto', sans-serif" font-size="38" font-weight="700" fill="#2E5BBA" text-anchor="middle">220-200-4022</text>
<text x="425" y="145" font-family="'Poppins', 'Montserrat', 'Segoe UI', sans-serif" font-size="38" font-weight="700" fill="#388E3C" text-anchor="middle">220-200-4022</text>
<!-- Email -->
<text x="425" y="200" font-family="'Roboto', sans-serif" font-size="24" font-weight="400" fill="#4a4a4a" text-anchor="middle">contact@loperboys.com</text>
<text x="425" y="200" font-family="'Inter', 'Nunito', 'Segoe UI', sans-serif" font-size="24" font-weight="400" fill="#555555" text-anchor="middle">contact@loperboys.com</text>
<!-- Website -->
<text x="425" y="250" font-family="'Roboto', sans-serif" font-size="28" font-weight="500" fill="#1A4D2E" text-anchor="middle">loperboys.com</text>
<text x="425" y="250" font-family="'Poppins', 'Montserrat', 'Segoe UI', sans-serif" font-size="28" font-weight="600" fill="#1B5E20" text-anchor="middle">loperboys.com</text>
<!-- Service area -->
<text x="425" y="310" font-family="'Roboto', sans-serif" font-size="20" font-weight="400" fill="#666666" text-anchor="middle">Serving Warsaw &amp; Surrounding Areas</text>
<text x="425" y="310" font-family="'Inter', 'Nunito', 'Segoe UI', sans-serif" font-size="20" font-weight="400" fill="#666666" text-anchor="middle">Serving Warsaw &amp; Surrounding Areas</text>
<!-- Services summary -->
<rect x="125" y="340" width="600" height="1" fill="#e0e0e0"/>
<text x="425" y="375" font-family="'Roboto', sans-serif" font-size="16" font-weight="400" fill="#666666" text-anchor="middle">Lawn Care • Gutters • Windows • Snow Removal • More!</text>
<rect x="125" y="340" width="600" height="1" fill="#C8E6C9"/>
<text x="425" y="375" font-family="'Inter', 'Nunito', 'Segoe UI', sans-serif" font-size="16" font-weight="400" fill="#666666" text-anchor="middle">Lawn Care • Gutters • Windows • Snow Removal • More!</text>
<!-- Payment methods -->
<text x="425" y="420" font-family="'Roboto', sans-serif" font-size="16" font-weight="500" fill="#4a4a4a" text-anchor="middle">Cash • Venmo • Cash App</text>
<text x="425" y="420" font-family="'Inter', 'Nunito', 'Segoe UI', sans-serif" font-size="16" font-weight="500" fill="#555555" text-anchor="middle">Cash • Venmo • Cash App</text>
<!-- Bottom accent -->
<rect x="0" y="480" width="850" height="20" fill="#2E5BBA"/>
<path d="M0,480 Q0,500 20,500 L830,500 Q850,500 850,480 Z" fill="#2E5BBA"/>
</svg>
<rect x="0" y="480" width="850" height="20" fill="#1B5E20"/>
<path d="M0,480 Q0,500 20,500 L830,500 Q850,500 850,480 Z" fill="#1B5E20"/>
</svg>

Before

Width:  |  Height:  |  Size: 2.3 KiB

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 238 KiB

After

Width:  |  Height:  |  Size: 53 KiB

+11 -12
View File
@@ -1,15 +1,15 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 850 500" width="3.5in" height="2in">
<defs>
<linearGradient id="bgGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#2E5BBA;stop-opacity:1" />
<stop offset="100%" style="stop-color:#1E3F8A;stop-opacity:1" />
<stop offset="0%" style="stop-color:#388E3C;stop-opacity:1" />
<stop offset="100%" style="stop-color:#1B5E20;stop-opacity:1" />
</linearGradient>
<linearGradient id="accentBar" x1="0%" y1="0%" x2="100%" y2="0%">
<stop offset="0%" style="stop-color:#F5A623;stop-opacity:1" />
<stop offset="100%" style="stop-color:#E8951E;stop-opacity:1" />
</linearGradient>
<style>
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@500;700&amp;family=Roboto:wght@400;500&amp;display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@500;600;700&amp;family=Inter:wght@400;500&amp;display=swap');
</style>
</defs>
@@ -19,29 +19,28 @@
<!-- Decorative corner accent -->
<path d="M0,0 L200,0 L200,8 L8,8 L8,200 L0,200 Z" fill="#F5A623" opacity="0.3"/>
<!-- Subtle pattern - gear/leaf motif background -->
<!-- Subtle pattern - leaf circles -->
<circle cx="750" cy="420" r="120" fill="white" opacity="0.03"/>
<circle cx="780" cy="390" r="80" fill="white" opacity="0.03"/>
<!-- Logo icon - simple leaf/house combo -->
<!-- Logo icon - leaf motif -->
<g transform="translate(425, 155) scale(1.2)">
<!-- Leaf shape -->
<path d="M0,-50 C30,-50 55,-20 55,10 C55,40 25,60 0,75 C-25,60 -55,40 -55,10 C-55,-20 -30,-50 0,-50 Z" fill="#F5A623" opacity="0.9"/>
<!-- Leaf vein -->
<line x1="0" y1="-50" x2="0" y2="75" stroke="#1E3F8A" stroke-width="2" opacity="0.5"/>
<line x1="0" y1="-10" x2="25" y2="15" stroke="#1E3F8A" stroke-width="1.5" opacity="0.4"/>
<line x1="0" y1="15" x2="-25" y2="35" stroke="#1E3F8A" stroke-width="1.5" opacity="0.4"/>
<line x1="0" y1="-50" x2="0" y2="75" stroke="#1B5E20" stroke-width="2" opacity="0.5"/>
<line x1="0" y1="-10" x2="25" y2="15" stroke="#1B5E20" stroke-width="1.5" opacity="0.4"/>
<line x1="0" y1="15" x2="-25" y2="35" stroke="#1B5E20" stroke-width="1.5" opacity="0.4"/>
</g>
<!-- Brand name -->
<text x="425" y="310" font-family="'Oswald', sans-serif" font-size="72" font-weight="700" fill="white" text-anchor="middle" letter-spacing="3">LOPERBOYS</text>
<text x="425" y="310" font-family="'Poppins', 'Montserrat', 'Segoe UI', sans-serif" font-size="72" font-weight="700" fill="white" text-anchor="middle" letter-spacing="3">LOPERBOYS</text>
<!-- Tagline -->
<text x="425" y="355" font-family="'Roboto', sans-serif" font-size="22" font-weight="400" fill="rgba(255,255,255,0.85)" text-anchor="middle">Hard Work. Honest Prices. Local Service.</text>
<text x="425" y="355" font-family="'Inter', 'Nunito', 'Segoe UI', sans-serif" font-size="22" font-weight="400" fill="rgba(255,255,255,0.85)" text-anchor="middle">Hard Work. Honest Prices. Local Service.</text>
<!-- Accent bar at bottom -->
<rect x="0" y="480" width="850" height="20" fill="url(#accentBar)" rx="0" ry="0"/>
<rect x="0" y="480" width="850" height="6" fill="url(#accentBar)" rx="0" ry="0"/>
<!-- Bottom corners rounded by parent rect -->
<path d="M0,480 Q0,500 20,500 L830,500 Q850,500 850,480 Z" fill="url(#accentBar)"/>
</svg>
</svg>

Before

Width:  |  Height:  |  Size: 2.4 KiB

After

Width:  |  Height:  |  Size: 2.4 KiB