# Toolkit

## Toolkit

<figure><img src="/files/K4Vw3EsGCN59pnjFCBZp" alt=""><figcaption><p>Toolkit</p></figcaption></figure>

This segment encompasses all the necessary tools for constructing the UI. We'll delve into each tool individually, providing detailed explanations for features like the selection cursor, rectangle, text, and more.

### Selector Cursor

<figure><img src="/files/N4RitcVdv2vWO1Sksrxt" alt=""><figcaption><p>Selection Cursor</p></figcaption></figure>

The Selector Cursor within the Blup is your precision powerhouse.&#x20;

With a click, the standard cursor transforms into a selector cursor, tailored for picking and modifying components seamlessly. Empowering you to apply diverse properties from the panel, optimizes your workflow.&#x20;

Press '**V'** or 'Escape' for a smooth transition back to the selector cursor.

### Rectangle Toggle

<figure><img src="/files/RhAquc5gGN1SvcHQqZig" alt=""><figcaption><p>Rectangle Toogle</p></figcaption></figure>

The versatile Rectangle Toggle is utilized to generate rectangular shapes within the canvas or pages.&#x20;

When hovering over the rectangle button, a GIF showcasing the various functionalities achievable with the rectangle toggle&#x20;

Upon clicking the button and shifting the cursor to the pages section, it transforms into a cross cursor, facilitating the drawing of rectangular shapes on the screens akin to other designer tools on the market. The dimensions of the rectangle can be adjusted during its creation.&#x20;

Additionally, the properties panel located to the right of the screen offers the option to modify various other properties of the selected rectangle.&#x20;

Thanks to Blup's seamless integration with Windows/Mac OS, any images, GIFs, or videos present in your file explorer can be effortlessly dragged and dropped into any rectangle.

### Text Toggle

<figure><img src="/files/uGCqa3pdaX3TXOVudXvy" alt=""><figcaption><p>Text Toggle</p></figcaption></figure>

Crucial for textual components, the Text Toggle feature within the Blup tool serves as your creative ally.&#x20;

Hover over it for a demonstration, and Click to switch the cursor to a text cursor, enabling typing anywhere on the page.&#x20;

Easily adjust the font size by switching back to the selector cursor and click-dragging the bottom of the text cell.&#x20;

Delve into advanced customization options in the right-side panel.

{% hint style="info" %} <mark style="color:blue;">Note: Text is used to show information to the user</mark>
{% endhint %}

### EYE - Dynamic Content Visibility

<figure><img src="/files/AiT78Rtd0cIObKuR72MW" alt=""><figcaption><p>Eye - Dynamic Content Visibility</p></figcaption></figure>

The EYE tool in the Blup tool dynamically controls content visibility.&#x20;

Toggle elements based on runtime criteria, enhancing adaptability and interactivity in your design. It's a key player in crafting responsive and user-centric interfaces.

### Toolkit Tact - Flexible Palette Placement&#x20;

Toolkit Tact is your tool for personalized workspace within the Blup tool.&#x20;

Move the toolkit palette across the canvas as per your preferences and workflow needs. It offers flexibility for an adaptable and efficient design experience.

<figure><img src="/files/ErDk0hIAAaV7Xe9TmJp4" alt=""><figcaption><p>toolkit tact</p></figcaption></figure>

This toolkit ensures your UI designs are not just functional but visually compelling and user-friendly. Dive in and unleash your creativity within the Blup tool!

If you have any ideas to make Blup better you can share them through our [Discord community channel ](https://discord.com/channels/940632966093234176/965313562425823303)

## Music to go with.

{% embed url="<https://open.spotify.com/playlist/0vvXsWCC9xrXsKd4FyS8kM?si=2c7f55bd3f944878>" %}
Lofi music
{% endembed %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.blup.in/wiki/design-ui/tools-section.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.