Upgrade guide
Upgrading your Sprig CSS projects from v1 to v2.
Sprig CSS v2.0 is a new major version of the framework, so while we've worked hard to minimise breaking changes, some updates are necessary.
Using the upgrade tool
If you'd like to upgrade a project from v1 to v2, you can use our upgrade tool to do the vast majority of the heavy lifting for you:
npx @sprigcss/upgradeThe upgrade tool requires Node.js 20 or higher. Run it in a new branch, then carefully review the diff and test your project in the browser.
Changes from v1
Removed deprecated utilities
Deprecated | Replacement |
|---|---|
| Use opacity modifiers like |
| Use opacity modifiers like |
|
|
|
|
|
|
Renamed utilities
v1 | v2 |
|---|---|
|
|
|
|
|
|
|
|
|
|
|
|
Default border colour
In v1, the border-* and divide-* utilities used your configured gray-200 colour by default. We've changed this to currentColor in v2 to make Sprig less opinionated.
<div class="border border-gray-200 px-2 py-3 ...">
<!-- ... -->
</div>