Bothside: A Handwritten Font That Elevates Web Design with Personality
While working on a new landing page for a lifestyle coaching brand, I reached for Bothside to test how a handwritten font could bring warmth and personality to a digital experience. I wanted something that felt personal but still professional — a font that could stand out in a hero section without sacrificing clarity or usability. Bothside immediately caught my eye, and after testing it across real web layouts, I found it to be a compelling choice for creative brands looking to differentiate their online presence.
Bringing Emotional Appeal to Digital Branding
Bothside is a script font that mimics elegant, natural handwriting. Its soft curves and flowing strokes give it a distinctly human feel, making it ideal for brands that want to convey approachability, creativity, or intimacy. I used it in the hero section of a coaching website, pairing it with a clean sans serif for body text. The contrast worked beautifully — Bothside drew attention to the headline while maintaining a seamless visual hierarchy.
On a boutique online store I was redesigning, I tested Bothside for the brand name in the header and for short promotional banners. It added a personal touch that elevated the overall design, especially when layered over soft background images like linen textures or muted floral patterns. The font’s elegant script style gave the site a boutique feel that aligned perfectly with the brand’s aesthetic.
Responsive Design and Readability Considerations
When using Bothside in web design, it's important to consider readability, especially on smaller screens. I tested it on mobile layouts and found that it works best at larger sizes — ideal for headlines, callouts, and logo text. At smaller font sizes, the fine strokes and ligatures can become less distinct, which may impact legibility.
I used Bothside for a hero headline on a product landing page and found it performed well when paired with a strong color contrast. It looked especially sharp over light background images when set in a darker shade. On dark backgrounds, I adjusted the weight slightly and added a subtle drop shadow to ensure it remained readable. For buttons and navigation elements, I opted for a simpler sans serif to keep the interface clean and functional.
Font Pairing for Balanced Web Layouts
One of the most effective ways to use Bothside in web design is through thoughtful font pairing. Because it’s a decorative script font, it shines brightest when balanced with a more neutral typeface. I often paired it with a minimalist sans serif like Montserrat or Open Sans for body copy and UI elements. This created a visual rhythm that felt both modern and expressive.
For a creative portfolio site, I paired Bothside with a serif font in subheadings to add a touch of editorial flair. The combination gave the site a curated, magazine-like feel while keeping the user experience intuitive. When designing a course sales page, I used Bothside for the course title and testimonials, and a clean sans serif for the bullet points and descriptions — a combination that felt both personal and persuasive.
Webfont Performance and Licensing
Before finalizing the implementation, I checked the webfont formats included with Bothside. It came with WOFF and WOFF2 versions, which are optimized for fast loading and broad browser support. I also made sure the font was licensed for commercial use, especially since I was deploying it on client websites and digital templates.
Bothside includes a variety of alternate characters and ligatures, which allowed me to customize the look for different headlines. For example, I used a swash version for a blog header and a more restrained style for a CTA button. The multilingual support was also a plus, as it allowed me to use the font across international websites without character issues.
When to Use — and When to Avoid — Bothside
Bothside excels in display use cases: hero headlines, logo text, testimonials, and short promotional phrases. It’s not ideal for long paragraphs, form labels, or small interface text where clarity is critical. I avoided using it for navigation menus and instead reserved it for high-impact areas where visual appeal could take center stage.
For a recent blog redesign, I considered using Bothside for post titles but ultimately opted for a more legible serif font due to the volume of content. However, I did use it for featured quote blocks and author bios, where its personality added a nice visual break from the standard layout.
