> For the complete documentation index, see [llms.txt](https://dmnchzl.gitbook.io/element-documentation/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://dmnchzl.gitbook.io/element-documentation/introduction.md).

# Introduction

**Element** is a lightweight, reactive frontend framework that brings you back to the basics of Web development. Inspired by Lit and Solid, Element is built without a Virtual DOM, relying instead on JavaScript/TypeScript and a signal-based reactive system.

<figure><img src="/files/CfEy5b1INpqq8jIlzevD" alt=""><figcaption></figcaption></figure>

### Why Element?

In a world of complex frameworks with steep learning curves, Element offers a refreshing approach:

* **Back to Basics**: No Virtual DOM overhead - Just native DOM manipulation
* **Signal-based Reactivity**: Use the familiar `signal/effect` pattern
* **Lightweight**: Minimal bundle size with maximum performance
* **TypeScript First**: Built with TypeScript for better developer experience
* **Intuitive API**: Clean, readable code that's easy to understand and maintain

### Key Features

* 🔄 **Reactive System**: Fine-grained reactivity with signals and effects
* 🎯 **Native DOM Manipulation**: No Virtual DOM layer for better performance
* 🎨 **Template Literals**: HTML-like syntax using tagged template literals
* 🧩 **Built-in Components**: Conditional rendering and list components included
* 📦 **Zero Dependencies**: Lightweight and self-contained
* 🔧 **TypeScript Support**: Full type safety and excellent IDE support

#### Philosophy

Element follows the principle of **progressive enhancement**. Start with standard HTML and JavaScript, then add reactivity where needed. The framework stays out of your way while providing powerful tools for building modern Web applications.