Create your design system

Let's dig deeper to se how Headspin UI is made. In this series of the articles you will learn more about system decision what went into making Headspin UI.
Typography Min

Modern approach to typography

Please read end of the article before implementing any of code on your website. In the first part of the article px will be used so it is easier to…
Read more
Color System Min

Color system

One of the most complicated things to get right in development is getting colors right. While there is some math that can help with certain parts of the color system,…
Read more
Spacing System Min

Spacing system

As this article is part of series, most of the underlying concepts and fundamentals like: are covered in our article about typography. So here we are going just quickly recap…
Read more
Cover

Figma Library

Headspin offers a collection of wireframes for Figma designed to accelerate the process of prototyping and designing websites. Getting Started Within your account, you’ll find a link to the Figma…
Read more
Placeholder Dark Min

Getting started with Headspin

After you have completed your purchase, follow these steps to get started easily. On a new site installation: Plugin settings: Now, you can start copying and pasting wireframes from our…
Read more
Headspin Logo Placeholder

Site Performance Update

We are happy to announce that we are close to ending performance optimization. When we launched Headspin platform, we did it without many performance optimization and as thought that could…
Read more

Breakdance DIY Dark mode toggle

While we are working on making dark mode toggle element. I will share small workaround to create dark mode switching button. This is not the best method, rather workaround as…
Read more

Latest articles

Let's dig deeper to se how Headspin is made. In this series of the articles you will learn more about system decision what went into  making Headspin

Slider Framework

The Slider Framework is a wrapper code for the Breakdance Builder that allows users to easily create and customize responsive sliders using the Swiper.js library. It integrates seamlessly, offering extensive…
Read more

Dynamic Tabs

An a11y-friendly Dynamic Tabs component is designed to be accessible and responsive, providing a seamless user experience across devices. It adapts to different screen sizes by transforming traditional tabs into…
Read more

Whiskey template documentation

Whiskey template is being shipped as a whole “site” via Updraft plugin. Getting Started You always need to start with a fresh install of WordPress. As a first step, install…
Read more

Dynamic Lightbox

There are two variations Dynamic Lightbox component: Configuration Dynamic data Configuration for dynamic data is the same as pulling any post within Breakdance. We’ll have Post loop element inside page…
Read more

Plugin Update: v1.2.2

Based on the feedback that we gathered in communication with our users, we are introducing few new things which should improve quality of life for our users. Improved color palette…
Read more

Theme switches docs

In this article, we are going to cover how we could modify the styling and functionality of theme switches. Styling options As shown in the image image below, we have…
Read more

Animated theme toggles

Styling options  For basic styles like size and color we need to navigate to the code block called “Theme toggle Code” (1) and under the design tab we should have…
Read more
Headspin Logo
1.2.3
Built with
Breakdance
and
Headspinui
@ 2024 HeadspinUI. All rights reserved.