# @morfeo/preset-default

> ![Morfeo logo](https://morfeo.dev/img/morfeo.png)

Latest version **0.9.3** (published 2023-09-19) · MIT license · 0 weekly downloads

## Install

```sh
npm install @morfeo/preset-default
pnpm add @morfeo/preset-default
yarn add @morfeo/preset-default
bun add @morfeo/preset-default
```

## Health

**Score 40/100 (D)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high maintenance score.

Warnings: low downloads; pre 1.0.

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 0.9.3 |
| Published | 2023-09-19 |
| First published | 2021-08-08 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 169.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 37 |
| Author | Andrea Simone Porceddu |
| Maintainers | maurohertz |
| Keywords | design, system, morfeo, morfeo-js |

## Links

- npm: https://www.npmjs.com/package/@morfeo/preset-default
- Repository: https://github.com/morfeojs/morfeo
- Homepage: https://morfeo.dev
- Issues: https://github.com/morfeojs/morfeo/issues
- npm.io page: https://npm.io/package/@morfeo/preset-default

## Recent versions

- 0.9.3 (latest) — 2023-09-19
- 0.9.2 — 2023-04-27
- 0.9.1 — 2023-04-27
- 0.9.0 — 2023-04-16
- 0.8.0 — 2023-01-28
- 0.7.0 — 2022-05-30
- 0.6.0 — 2022-05-26
- 0.5.1 — 2022-04-30
- 0.5.0 — 2022-02-13
- 0.4.2 — 2021-11-18
- 0.4.1 — 2021-11-18
- 0.4.0 — 2021-11-18
- 0.3.2 — 2021-11-04
- 0.3.1 — 2021-11-04
- 0.3.0 — 2021-10-30
- … 1 more at https://npm.io/package/@morfeo/preset-default/versions

## README

# @morfeo/preset-default

![Morfeo logo](https://morfeo.dev/img/morfeo.png)

`@morfeo/preset-default` is the fastest way to start using morfeo with 2 complete themes!
It expose 2 themes, `light` and `dark`, you can you use these themes as they are or customize them to fit your design!

**@morfeo/preset-default** is part of the [@morfeo](https://morfeo.dev) eco-system, a set of **framework-agnostic** tools that help you to create beautiful design systems for your web and mobile apps.

---

[Documentation](https://morfeo.dev) | [API](https://github.com/morfeojs/morfeo) | [Contributing](https://github.com/morfeojs/morfeo/blob/main/CONTRIBUTING.md) | [![Discord](https://badgen.net/badge/icon/discord?icon=discord&label)](https://discord.gg/5hbsKMBRBh)

---

## Installation

with [npm](https://www.npmjs.com/package/@morfeo/preset-default):

```bash
npm install @morfeo/preset-default
```

or [yarn](https://yarn.pm/@morfeo/preset-default):

```bash
yarn add @morfeo/preset-default
```

## Usage

```typescript
import { initPreset } from '@morfeo/preset-default';

initPreset();
```

Or alternatively

```typescript
import { lightTheme, darkTheme } from '@morfeo/preset-default';

morfeo.setTheme('light', {...lightTheme, ...yourOverrides });
```

The preset expose 2 themes, one `light` and one `dark`:

```typescript
import { lightTheme, darkTheme } from '@morfeo/preset-default';
```

If you like our themes, you can easily use them in your app with the `initPreset` function:

```typescript
import { initPreset } from '@morfeo/preset-default';

morfeo.setCurrentTheme('light'); // Used by default
// OR
morfeo.setCurrentTheme('dark');
```

You can use these themes as they are or customize theme to fit your design:

```typescript
import { darkTheme, lightTheme } from '@morfeo/preset-default';

morfeo.setTheme('dark', {
  ...darkTheme,
  colors: myDarkColors,
});

morfeo.setTheme('light', {
  ...darkTheme,
  colors: myLightColors,
});
```

---
_Source: https://npm.io/package/@morfeo/preset-default · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._