Install - Angular
The Angular components ship as an installable library, adek-ui, with an ng add schematic - setup is a single terminal command. Requires Angular 17.3 or newer.
Quick install
# Prerequisite (once per machine): the Angular CLI
npm install -g @angular/cli
# Inside your Angular project, one command sets up the system:
ng add adek-ui
# No global CLI? This works too, from inside the project:
npx ng add adek-ui
# The ng-add schematic automatically:
# - installs the adek-ui package from npm
# - registers the three ADEK stylesheets in angular.json
# (tokens.css, adek.css, adek-applications.css)
# - adds the Montserrat <link> tags to index.htmlManual setup
# Prefer manual control? Install and wire it yourself:
npm install adek-ui
# then add the styles to angular.json:
"styles": [
"src/styles.css",
"node_modules/adek-ui/styles/tokens.css",
"node_modules/adek-ui/styles/adek.css",
"node_modules/adek-ui/styles/adek-applications.css"
]Usage
All components are standalone - import them straight into your component's imports array. Every component page on this site has a matching Angular snippet.
// Import the standalone components you need
import { Component } from '@angular/core';
import { AdekButton } from 'adek-ui';
@Component({
selector: 'app-example',
standalone: true,
imports: [AdekButton],
template: `
<button adek-button hierarchy="primary" size="md">
Button CTA
</button>
`,
})
export class ExampleComponent {}