Start
Foundations
Design Systemv1.3.0Search documentation
Search for a command to run or a page to navigate to.
Design Systemv1.3.0Search for a command to run or a page to navigate to.
Move your CSS, font, and asset links from strongtie.com/studs to the design.strongtie.io CDN.
Legacy CSS, font, and asset links point at strongtie.com/studs. Everything now lives on design.strongtie.io/cdn, with cleaner paths and explicit version pinning. This guide covers what changed, how to update your links, and how to verify the result.
| Item | Old (Legacy) | New (CDN) |
|---|---|---|
| Base URL | https://www.strongtie.com/studs/ | https://design.strongtie.io/cdn/ |
| File Name | studs-ui-kit.css | ui-kit.css |
| Font Path | https://www.strongtie.com/studs/font/ | https://design.strongtie.io/cdn/fonts/ |
| UI Kit Path | /studs/v2.5.4/studs-ui-kit.css | /ui-kit/v2.5.4/ui-kit.css |
| Styles Path | N/A | /styles/latest/all.css |
| Current Path | /studs/current-2.5/studs-ui-kit.css | /ui-kit/latest/ui-kit.css |
The new design.strongtie.io/cdn CDN provides:
Update all <link> tags that reference the old CDN to use the new CDN URLs.
Before (old CDN):
<!-- Version-specific -->
<link
rel="stylesheet"
href="https://www.strongtie.com/studs/v2.5.4/studs-ui-kit.css"
/>
<!-- Current/Latest -->
<link
rel="stylesheet"
href="https://www.strongtie.com/studs/current-2.5/studs-ui-kit.css"
/>After (new CDN):
<!-- Version-specific Telerik UI Kit -->
<link
rel="stylesheet"
href="https://design.strongtie.io/cdn/ui-kit/v2.5.4/ui-kit.css"
/>
<!-- Latest Telerik UI Kit version -->
<link
rel="stylesheet"
href="https://design.strongtie.io/cdn/ui-kit/latest/ui-kit.css"
/>
<!-- Or use modular Design System styles -->
<link
rel="stylesheet"
href="https://design.strongtie.io/cdn/styles/latest/all.css"
/>If you're loading fonts directly from the CDN, update those URLs as well.
Before (old CDN):
<link
rel="stylesheet"
href="https://www.strongtie.com/studs/font/helvetica-now.css"
/>After (new CDN):
<!-- Font stylesheet with @font-face declarations (recommended) -->
<link
rel="stylesheet"
href="https://design.strongtie.io/cdn/styles/latest/fonts.css"
/>/* Or declare the variable font directly */
@font-face {
font-family: "HelveticaNowRoman";
font-weight: 1 1000;
font-style: normal;
src: url("https://design.strongtie.io/cdn/fonts/helvetica-now/HelveticaNowVariableRoman_normal_normal.woff2")
format("woff2");
}If you have documentation or download pages that link to CDN resources, update those as well.
Before (old CDN):
<a href="https://www.strongtie.com/studs/v2.5.4/studs-ui-kit.css" download>
Download CSS
</a>After (new CDN):
<a href="https://design.strongtie.io/cdn/ui-kit/v2.5.4/ui-kit.css" download>
Download CSS
</a>If you're importing CDN URLs in JavaScript or CSS files, update those references.
Before (old CDN):
// JavaScript
const stylesheetUrl = "https://www.strongtie.com/studs/v2.5.4/studs-ui-kit.css"/* CSS */
@import url("https://www.strongtie.com/studs/v2.5.4/studs-ui-kit.css");After (new CDN):
// JavaScript
const stylesheetUrl = "https://design.strongtie.io/cdn/ui-kit/v2.5.4/ui-kit.css"/* CSS */
@import url("https://design.strongtie.io/cdn/ui-kit/v2.5.4/ui-kit.css");After updating all references:
Clear your browser cache:
Ctrl/Cmd + Shift + DeleteCtrl/Cmd + Shift + DeleteCmd + Option + ETest your application:
Use browser DevTools to verify:
Open DevTools → Network tab → Filter by CSS
Reload the page and confirm requests go to design.strongtie.io/cdn
Use your code editor's find-and-replace feature to update all references:
Find: https://www.strongtie.com/studs/
Replace: https://design.strongtie.io/cdn/ui-kit/
Find: studs-ui-kit.css
Replace: ui-kit.css
Find: ui-kit/current-2.5/ui-kit.css
Replace: ui-kit/latest/ui-kit.css
# Update base URL for UI Kit
find . -type f \( -name "*.html" -o -name "*.css" -o -name "*.js" -o -name "*.jsx" -o -name "*.tsx" \) \
-exec sed -i '' 's|https://www.strongtie.com/studs/|https://design.strongtie.io/cdn/ui-kit/|g' {} +
# Update file name
find . -type f \( -name "*.html" -o -name "*.css" -o -name "*.js" -o -name "*.jsx" -o -name "*.tsx" \) \
-exec sed -i '' 's|studs-ui-kit\.css|ui-kit.css|g' {} +
# Update current path to latest
find . -type f \( -name "*.html" -o -name "*.css" -o -name "*.js" -o -name "*.jsx" -o -name "*.tsx" \) \
-exec sed -i '' 's|ui-kit/current-2\.5/ui-kit\.css|ui-kit/latest/ui-kit.css|g' {} +# Update base URL
Get-ChildItem -Recurse -Include *.html,*.css,*.js,*.jsx,*.tsx |
ForEach-Object {
(Get-Content $_.FullName) -replace 'https://www\.strongtie\.com/studs/', 'https://design.strongtie.io/cdn/ui-kit/' |
Set-Content $_.FullName
}
# Update file name
Get-ChildItem -Recurse -Include *.html,*.css,*.js,*.jsx,*.tsx |
ForEach-Object {
(Get-Content $_.FullName) -replace 'studs-ui-kit\.css', 'ui-kit.css' |
Set-Content $_.FullName
}
# Update current path to latest
Get-ChildItem -Recurse -Include *.html,*.css,*.js,*.jsx,*.tsx |
ForEach-Object {
(Get-Content $_.FullName) -replace 'ui-kit/current-2\.5/ui-kit\.css', 'ui-kit/latest/ui-kit.css' |
Set-Content $_.FullName
}latest or a specific version?Use latest when:
<link
rel="stylesheet"
href="https://design.strongtie.io/cdn/ui-kit/latest/ui-kit.css"
/>Use a specific version when:
<link
rel="stylesheet"
href="https://design.strongtie.io/cdn/ui-kit/v2.5.4/ui-kit.css"
/>Recommendation: Use specific versions in production to avoid unexpected styling changes. Test new versions in a staging environment before updating.
The new CDN provides access to multiple resources organized into different paths:
<!-- All UI Kit styles in one file (recommended for most projects) -->
<link
rel="stylesheet"
href="https://design.strongtie.io/cdn/ui-kit/latest/ui-kit.css"
/>
<!-- Or use a specific version -->
<link
rel="stylesheet"
href="https://design.strongtie.io/cdn/ui-kit/v2.5.4/ui-kit.css"
/><!-- All styles combined -->
<link
rel="stylesheet"
href="https://design.strongtie.io/cdn/styles/latest/all.css"
/>
<!-- Or load individual modules -->
<link
rel="stylesheet"
href="https://design.strongtie.io/cdn/styles/latest/tokens.css"
/>
<link
rel="stylesheet"
href="https://design.strongtie.io/cdn/styles/latest/fonts.css"
/>
<link
rel="stylesheet"
href="https://design.strongtie.io/cdn/styles/latest/components.css"
/>
<link
rel="stylesheet"
href="https://design.strongtie.io/cdn/styles/latest/reset.css"
/>You can also add fonts to your application by including the fonts.css file
from the modular design system styles.
<!-- Font stylesheet with @font-face declarations -->
<link
rel="stylesheet"
href="https://design.strongtie.io/cdn/styles/latest/fonts.css"
/>Direct variable font file access:
https://design.strongtie.io/cdn/fonts/helvetica-now/HelveticaNowVariableRoman_normal_normal.woff2https://design.strongtie.io/cdn/fonts/helvetica-now/HelveticaNowVariableRoman_normal_normal.woffhttps://design.strongtie.io/cdn/fonts/helvetica-now/HelveticaNowVariableItalic_italic_normal.woff2Problem: Page loads but styles are missing or broken.
Look for 404 errors in the browser console.
It should point to https://design.strongtie.io/cdn/ui-kit/latest/ui-kit.css.
Clear your browser cache.
A corporate firewall may be blocking the CDN.
Problem: Text appears in fallback fonts instead of Helvetica Now.
The <link> should point to https://design.strongtie.io/cdn/styles/latest/fonts.css.
Look for font file requests in browser DevTools.
Ensure font files aren't blocked by CORS or CSP policies.
Problem: Browser shows "Mixed Content" warnings.
The page must use HTTPS — the CDN requires it.
Use https:// (not http://) for every CDN URL.
Check for any hardcoded HTTP URLs in your stylesheets.
Problem: Changes aren't appearing even after updating URLs.
Ctrl/Cmd + Shift + R.
Clear your browser cache completely.
Open a private window to rule out caching.
CDN, proxy, and any other caching layers.
Problem: Specific version URL returns 404 error.
Available: v2.5.4, v2.5.3, v2.5.2, v2.5.1, v2.5.0, and v2.2.2 and earlier (legacy).
Use latest in the URL instead of a pinned version.
See the Resources page.
If you use Content Security Policy headers, you'll need to allow the new CDN domain.
Content-Security-Policy:
style-src 'self' https://design.strongtie.io;
font-src 'self' https://design.strongtie.io;
<meta
http-equiv="Content-Security-Policy"
content="style-src 'self' https://design.strongtie.io; font-src 'self' https://design.strongtie.io;"
/>The old CDN URLs (https://www.strongtie.com/studs/) will continue to work for the foreseeable future, but we strongly encourage migrating to the new CDN as soon as possible.