How New UI prepared their website for AI search
Discover New UI, a modern semantic framework for crafting beautiful, accessible websites and apps with stunning, ready-to-deploy templates.
76
Lines
-95% vs avg
5
Sections
-79% vs avg
742+
Companies
using llms.txt
2
Files
llms.txt + full
Key Insights
Focused approach
A streamlined 5-section structure keeps things simple and scannable.
Optimal length
At 76 lines, this file balances detail with AI context window efficiency.
Two-file approach
Uses both llms.txt and llms-full.txt for different AI use cases.
llms.txt Preview
First 76 lines of 76 total
# About New UI
New UI is a modern, semantic UI framework for building beautiful, accessible sites and apps.
## Templates
Beautifully crafted, production-ready, and easy to deploy templates.
- [Templates](https://new-ui.com/templates) — Beautifully crafted, production-ready, and easy to deploy templates.
- [Blog lite](https://new-ui.com/templates/blog-lite) — A simple, minimal blog template for Astro.
- [Coming soon page](https://new-ui.com/templates/coming-soon) — A simple coming soon page for better pre-launch conversions.
- [Directory](https://new-ui.com/templates/directory) — Build your directory site. Fast & easy.
- [Documentation](https://developers.cloudflare.com/agents/index.md) — A fast, focused documentation site template.
- [Job listing](https://new-ui.com/templates/job-listing) — Launch your job listing site in minutes.
- [Journal](https://new-ui.com/templates/journal) — An Astro blog template.
- [Spec](https://new-ui.com/templates/spec) — A simple template for publishing better spec pages.
- [Writer](https://new-ui.com/templates/writer) — A minimal blog template for developers and writers.
## Getting Started
- [Installation](https://new-ui.com/docs/getting-started/installation) — A quick guide to getting started with New UI.
## Foundations
- [Colors](https://new-ui.com/docs/foundations/colors) — New UI color system.
- [Effects](https://new-ui.com/docs/foundations/effects) — New UI layering, elevations and effects styles.
- [Spacings](https://new-ui.com/docs/foundations/spacings) — New UI spacings.
- [Typography](https://new-ui.com/docs/foundations/typography) — New UI modular typographic scale.
- [Reset](https://new-ui.com/docs/foundations/reset) — Modern SCSS, CSS reset.
## Theming
- [Configuration](https://new-ui.com/docs/theming/configuration) — Default themes to quickly change the look and feel of your app.
## Installation
To set up the project, open your terminal and run the following command:
```
npm i -D @new-ui/foundations
```
#### Import
Import the New UI foundations by adding the following line at the top of your SCSS file:
```scss
@use '@new-ui/foundations'; // Use `@import` for CSS
```
#### Set the theme
Set the theme by adding the `data-new-ui-theme` attribute to your HTML wrapper element, for example:
```html
<html data-new-ui-theme="light">
```
|---
| Available themes | Value
|-|:-|:-
| Light (Default) | `light`
| Light warm | `light--warm`
| Light cold | `light--cold`
| Dark (Default) | `dark`
| Dark warm | `dark--warm`
| Dark cold | `dark--cold`
|---
#### Usage guide
- All classes associated with the New UI are prefixed with a global namespace followed by a hyphen: `nu-`
- In addition to a global namespace, we added prefixes to each class to make it more apparent what job that class is doing using BEM syntax.
- `c-` for UI components.
- `l-` for layout-related styles.
- `u-` for utilities.
- `is-` and has- for specific states.
- `js-` for targeting JavaScript-specific functionality.
---New UI is ready for AI search. Are you?
Join 742+ companies preparing their websites for the future of search. Create your llms.txt file in minutes.
Generate Your llms.txtDon't get left behind
Your competitors are preparing for AI search.
New UI has 5 organized sections ready for AI crawlers. Generate your llms.txt file and join the companies optimizing for the future of search.