floors-brand-assets 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +97 -0
- package/colors/index.js +23 -0
- package/colors/index.ts +27 -0
- package/colors/tokens.json +60 -0
- package/fonts/README.md +70 -0
- package/guidelines.md +249 -0
- package/logos/svg/Floor Logo Light.svg +13 -0
- package/logos/svg/Floors Logo Dark.svg +13 -0
- package/logos/svg/Floors Logotype Dark.svg +3 -0
- package/logos/svg/Floors Logotype Light.svg +3 -0
- package/logos/svg/Floors Symbol Dark.svg +12 -0
- package/logos/svg/Floors Symbol Light.svg +12 -0
- package/logos/svg/Logo Dark BG.svg +32 -0
- package/logos/svg/Logo Light BG.svg +32 -0
- package/logos/svg/Symbol Dark BG.svg +13 -0
- package/logos/svg/Symbol Light BG.svg +13 -0
- package/package.json +31 -0
package/README.md
ADDED
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
# @floorsfinance/brand-assets
|
|
2
|
+
|
|
3
|
+
Official brand assets for **Floors Finance** — modern, minimal, high-contrast DeFi/fintech platform.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npm install @floorsfinance/brand-assets
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## Quick Start
|
|
12
|
+
|
|
13
|
+
### Import Colors
|
|
14
|
+
|
|
15
|
+
```typescript
|
|
16
|
+
// TypeScript
|
|
17
|
+
import { MINT, TANGERINE, NIGHTY, WHITE, PLATINUM } from '@floorsfinance/brand-assets/colors';
|
|
18
|
+
import { colors } from '@floorsfinance/brand-assets/colors';
|
|
19
|
+
|
|
20
|
+
// JavaScript
|
|
21
|
+
const { MINT, NIGHTY } = require('@floorsfinance/brand-assets/colors');
|
|
22
|
+
```
|
|
23
|
+
|
|
24
|
+
### Use Design Tokens
|
|
25
|
+
|
|
26
|
+
```typescript
|
|
27
|
+
import tokens from '@floorsfinance/brand-assets/colors/tokens.json';
|
|
28
|
+
|
|
29
|
+
console.log(tokens.tokens.color.accent.mint.value); // #BEFFB0
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
## Package Structure
|
|
33
|
+
|
|
34
|
+
```
|
|
35
|
+
@floorsfinance/brand-assets/
|
|
36
|
+
├── colors/
|
|
37
|
+
│ ├── index.js # JavaScript exports
|
|
38
|
+
│ ├── index.ts # TypeScript definitions
|
|
39
|
+
│ └── tokens.json # W3C DTCG design tokens
|
|
40
|
+
├── logos/
|
|
41
|
+
│ └── svg/ # All logo variants (Light/Dark)
|
|
42
|
+
├── fonts/
|
|
43
|
+
│ └── README.md # Font installation guide
|
|
44
|
+
├── examples/
|
|
45
|
+
│ └── usage.tsx # React/TypeScript examples
|
|
46
|
+
├── guidelines.md # Complete brand guidelines
|
|
47
|
+
└── package.json
|
|
48
|
+
```
|
|
49
|
+
|
|
50
|
+
## Color Palette
|
|
51
|
+
|
|
52
|
+
| Token | Value | Usage |
|
|
53
|
+
|-------|-------|-------|
|
|
54
|
+
| `MINT` | `#BEFFB0` | Fresh accent, primary action |
|
|
55
|
+
| `TANGERINE` | `#FFB651` | Warm accent, callouts |
|
|
56
|
+
| `NIGHTY` | `#101114` | Primary dark background |
|
|
57
|
+
| `WHITE` | `#FFFFFF` | Clean base |
|
|
58
|
+
| `PLATINUM` | `#F4F4F5` | Neutral light surface |
|
|
59
|
+
|
|
60
|
+
## Typography
|
|
61
|
+
|
|
62
|
+
**Primary Typeface**: Poppins (Google Fonts)
|
|
63
|
+
|
|
64
|
+
All text uses Poppins with tight tracking (-4% to -2%). See `fonts/README.md` for installation.
|
|
65
|
+
|
|
66
|
+
### Hierarchy
|
|
67
|
+
|
|
68
|
+
| Level | Size | Line-height | Tracking |
|
|
69
|
+
|-------|------|-------------|----------|
|
|
70
|
+
| H1 | 56pt | 64pt | -4% |
|
|
71
|
+
| H2 | 40pt | 48pt | -4% |
|
|
72
|
+
| H3 | 36pt | 42pt | -4% |
|
|
73
|
+
| H4 | 28pt | 36pt | -2% |
|
|
74
|
+
| Subhead | 24pt | 32pt | -4% |
|
|
75
|
+
|
|
76
|
+
## Logo Assets
|
|
77
|
+
|
|
78
|
+
SVG logos are available in `logos/svg/`:
|
|
79
|
+
- Full lockup (horizontal)
|
|
80
|
+
- Wordmark only
|
|
81
|
+
- Symbol only
|
|
82
|
+
- Light/dark variants
|
|
83
|
+
|
|
84
|
+
**Minimum size**: 152px × 50px (horizontal lockup)
|
|
85
|
+
|
|
86
|
+
## Documentation
|
|
87
|
+
|
|
88
|
+
- **Brand Guidelines**: See `guidelines.md` for complete brand system
|
|
89
|
+
- **Code Examples**: See `examples/usage.tsx` for React integration
|
|
90
|
+
|
|
91
|
+
## License
|
|
92
|
+
|
|
93
|
+
MIT — See LICENSE file
|
|
94
|
+
|
|
95
|
+
## Support
|
|
96
|
+
|
|
97
|
+
For brand questions or asset requests, contact the Floors Finance team.
|
package/colors/index.js
ADDED
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
// Floors Finance Brand Colors
|
|
2
|
+
// Source: Floors-Finance-Brand-Guidelines.md
|
|
3
|
+
|
|
4
|
+
/** @type {const} */
|
|
5
|
+
export const colors = {
|
|
6
|
+
// Primary Accents
|
|
7
|
+
MINT: '#BEFFB0',
|
|
8
|
+
TANGERINE: '#FFB651',
|
|
9
|
+
|
|
10
|
+
// Neutrals
|
|
11
|
+
NIGHTY: '#101114',
|
|
12
|
+
WHITE: '#FFFFFF',
|
|
13
|
+
PLATINUM: '#F4F4F5',
|
|
14
|
+
} as const;
|
|
15
|
+
|
|
16
|
+
// Individual exports for convenience
|
|
17
|
+
export const MINT = '#BEFFB0';
|
|
18
|
+
export const TANGERINE = '#FFB651';
|
|
19
|
+
export const NIGHTY = '#101114';
|
|
20
|
+
export const WHITE = '#FFFFFF';
|
|
21
|
+
export const PLATINUM = '#F4F4F5';
|
|
22
|
+
|
|
23
|
+
export default colors;
|
package/colors/index.ts
ADDED
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
// Floors Finance Brand Colors - TypeScript Definitions
|
|
2
|
+
|
|
3
|
+
export interface ColorToken {
|
|
4
|
+
readonly value: string;
|
|
5
|
+
readonly type: 'color';
|
|
6
|
+
readonly description?: string;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
// Primary Colors
|
|
10
|
+
export const MINT: '#BEFFB0' = '#BEFFB0';
|
|
11
|
+
export const TANGERINE: '#FFB651' = '#FFB651';
|
|
12
|
+
export const NIGHTY: '#101114' = '#101114';
|
|
13
|
+
export const WHITE: '#FFFFFF' = '#FFFFFF';
|
|
14
|
+
export const PLATINUM: '#F4F4F5' = '#F4F4F5';
|
|
15
|
+
|
|
16
|
+
// Color palette object
|
|
17
|
+
export const colors = {
|
|
18
|
+
MINT: '#BEFFB0',
|
|
19
|
+
TANGERINE: '#FFB651',
|
|
20
|
+
NIGHTY: '#101114',
|
|
21
|
+
WHITE: '#FFFFFF',
|
|
22
|
+
PLATINUM: '#F4F4F5',
|
|
23
|
+
} as const;
|
|
24
|
+
|
|
25
|
+
export type ColorName = keyof typeof colors;
|
|
26
|
+
|
|
27
|
+
export default colors;
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
{
|
|
2
|
+
"$schema": "https://design-tokens.org/schema.json",
|
|
3
|
+
"name": "Floors Finance Design Tokens",
|
|
4
|
+
"version": "1.0.0",
|
|
5
|
+
"description": "Official design tokens for Floors Finance brand",
|
|
6
|
+
"tokens": {
|
|
7
|
+
"color": {
|
|
8
|
+
"accent": {
|
|
9
|
+
"mint": {
|
|
10
|
+
"value": "#BEFFB0",
|
|
11
|
+
"type": "color",
|
|
12
|
+
"description": "Fresh accent — highlight and primary action"
|
|
13
|
+
},
|
|
14
|
+
"tangerine": {
|
|
15
|
+
"value": "#FFB651",
|
|
16
|
+
"type": "color",
|
|
17
|
+
"description": "Warm accent — callouts and secondary action"
|
|
18
|
+
}
|
|
19
|
+
},
|
|
20
|
+
"neutral": {
|
|
21
|
+
"nighty": {
|
|
22
|
+
"value": "#101114",
|
|
23
|
+
"type": "color",
|
|
24
|
+
"description": "Primary dark background"
|
|
25
|
+
},
|
|
26
|
+
"white": {
|
|
27
|
+
"value": "#FFFFFF",
|
|
28
|
+
"type": "color",
|
|
29
|
+
"description": "Clean base"
|
|
30
|
+
},
|
|
31
|
+
"platinum": {
|
|
32
|
+
"value": "#F4F4F5",
|
|
33
|
+
"type": "color",
|
|
34
|
+
"description": "Neutral light surface"
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
},
|
|
38
|
+
"typography": {
|
|
39
|
+
"fontFamily": {
|
|
40
|
+
"primary": {
|
|
41
|
+
"value": "Poppins",
|
|
42
|
+
"type": "fontFamily",
|
|
43
|
+
"description": "Primary typeface for all text"
|
|
44
|
+
}
|
|
45
|
+
},
|
|
46
|
+
"tracking": {
|
|
47
|
+
"tight": {
|
|
48
|
+
"value": "-4%",
|
|
49
|
+
"type": "letterSpacing",
|
|
50
|
+
"description": "H1, H2, subhead tracking"
|
|
51
|
+
},
|
|
52
|
+
"medium": {
|
|
53
|
+
"value": "-2%",
|
|
54
|
+
"type": "letterSpacing",
|
|
55
|
+
"description": "H3, H4 tracking"
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
}
|
|
60
|
+
}
|
package/fonts/README.md
ADDED
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
# Floors Finance — Fonts
|
|
2
|
+
|
|
3
|
+
This package does not include font files due to licensing restrictions. Below are the recommended sources for obtaining the required fonts.
|
|
4
|
+
|
|
5
|
+
## Typography Stack
|
|
6
|
+
|
|
7
|
+
### Poppins (Primary Typeface)
|
|
8
|
+
**License**: Open Font License (OFL)
|
|
9
|
+
**Usage**: All typography — headlines, body, UI elements
|
|
10
|
+
|
|
11
|
+
**Weights Used**:
|
|
12
|
+
- Thin (100)
|
|
13
|
+
- Extra Light (200)
|
|
14
|
+
- Light (300)
|
|
15
|
+
- Regular (400)
|
|
16
|
+
- Medium (500)
|
|
17
|
+
- Semi Bold (600)
|
|
18
|
+
- Bold (700)
|
|
19
|
+
- Extra Bold (800)
|
|
20
|
+
- Black (900)
|
|
21
|
+
- + All italic variants
|
|
22
|
+
|
|
23
|
+
**Install via Google Fonts**:
|
|
24
|
+
```html
|
|
25
|
+
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
26
|
+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
27
|
+
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
**CSS**:
|
|
31
|
+
```css
|
|
32
|
+
font-family: 'Poppins', sans-serif;
|
|
33
|
+
```
|
|
34
|
+
|
|
35
|
+
**CDN Alternative**:
|
|
36
|
+
```html
|
|
37
|
+
<script src="https://cdn.jsdelivr.net/fontsource/fonts/poppins@latest/index.min.css"></script>
|
|
38
|
+
```
|
|
39
|
+
|
|
40
|
+
---
|
|
41
|
+
|
|
42
|
+
## Typography Hierarchy
|
|
43
|
+
|
|
44
|
+
| Level | Font | Size | Line-height | Tracking |
|
|
45
|
+
|-------|------|------|-------------|----------|
|
|
46
|
+
| H1 | Poppins Regular | 56pt | 64pt | -4% |
|
|
47
|
+
| H2 | Poppins Regular | 40pt | 48pt | -4% |
|
|
48
|
+
| H3 | Poppins Medium | 36pt | 42pt | -4% |
|
|
49
|
+
| H4 | Poppins Bold | 28pt | 36pt | -2% |
|
|
50
|
+
| Subhead | Poppins Regular | 24pt | 32pt | -4% |
|
|
51
|
+
|
|
52
|
+
---
|
|
53
|
+
|
|
54
|
+
## Logo Construction
|
|
55
|
+
|
|
56
|
+
For logo lockups, the following typefaces are used:
|
|
57
|
+
- **Founders Grotesk** — Symbol construction
|
|
58
|
+
- **Atkinson Hyperlegible** — Wordmark spacing
|
|
59
|
+
|
|
60
|
+
These are for reference only; use the provided SVG logos from `logos/svg/`.
|
|
61
|
+
|
|
62
|
+
---
|
|
63
|
+
|
|
64
|
+
## Usage Guidelines
|
|
65
|
+
|
|
66
|
+
- Use Poppins for **all** text elements
|
|
67
|
+
- Apply tight tracking (-4% to -2%) as specified in hierarchy
|
|
68
|
+
- Maintain high contrast: light-on-dark for heroes, dark-on-light for content
|
|
69
|
+
|
|
70
|
+
Refer to `guidelines.md` for complete brand guidelines.
|
package/guidelines.md
ADDED
|
@@ -0,0 +1,249 @@
|
|
|
1
|
+
# Floors Finance Brand Guidelines
|
|
2
|
+
|
|
3
|
+
Source: `Brand Guidelines.pen` (canvas-based guideline deck, 11 frames, 1920x1280 per page)
|
|
4
|
+
|
|
5
|
+
## 1) Brand Overview
|
|
6
|
+
|
|
7
|
+
Floors Finance uses a modern, minimal, high-contrast visual identity with:
|
|
8
|
+
- A dark core base (`Nighty`) and light support neutrals (`White`, `Platinum`)
|
|
9
|
+
- Two accent colors (`Mint`, `Tangerine`)
|
|
10
|
+
- Rounded geometric symbol forms used as background motif and logo mark
|
|
11
|
+
- A clean sans-serif typography system centered on **Poppins**
|
|
12
|
+
|
|
13
|
+
The deck includes:
|
|
14
|
+
- Cover page (Brand Identity)
|
|
15
|
+
- Section openers (Typography, Colors, Logo)
|
|
16
|
+
- Content pages for typography usage, type hierarchy, color palette, and logo variants
|
|
17
|
+
|
|
18
|
+
## 2) Core Color System
|
|
19
|
+
|
|
20
|
+
Primary palette found in the Color Palette section:
|
|
21
|
+
|
|
22
|
+
| Color Name | HEX | RGB | Typical Use |
|
|
23
|
+
|---|---|---|---|
|
|
24
|
+
| Mint | `#BEFFB0` | `190, 255, 176` | Fresh accent background, highlight areas |
|
|
25
|
+
| Tangerine | `#FFB651` | `255, 182, 81` | Warm accent, callout blocks |
|
|
26
|
+
| Nighty | `#101114` | `16, 17, 20` | Primary dark brand background/text on light accents |
|
|
27
|
+
| White | `#FFFFFF` | `245, 245, 245` (as written in file) | Clean base, reverse/negative logo/text |
|
|
28
|
+
| Platinum | `#F4F4F5` | `244, 244, 245` | Neutral light surface/background |
|
|
29
|
+
|
|
30
|
+
Notes:
|
|
31
|
+
- The file presents **White** as `HEX FFFFFF` but with RGB text `245, 245, 245`. This is a documented inconsistency in the source.
|
|
32
|
+
- Common text color pairings in the guideline:
|
|
33
|
+
- Dark text: `#101114` or `#06211A`
|
|
34
|
+
- Light text: `#FFFFFF`
|
|
35
|
+
|
|
36
|
+
## 3) Typography System
|
|
37
|
+
|
|
38
|
+
### Primary Typeface
|
|
39
|
+
- **Poppins** (Google Fonts)
|
|
40
|
+
- Demonstrated weights in the file:
|
|
41
|
+
- Medium (`500`)
|
|
42
|
+
- Semi Bold (`600`)
|
|
43
|
+
- Regular (`normal`/`400`)
|
|
44
|
+
- Bold (`700`) in hierarchy examples
|
|
45
|
+
|
|
46
|
+
### Character Set Preview
|
|
47
|
+
The typography page explicitly shows:
|
|
48
|
+
- Uppercase Latin alphabet
|
|
49
|
+
- Lowercase Latin alphabet
|
|
50
|
+
- Numerals
|
|
51
|
+
- Special characters (`& # $ € % @ ! ? *`)
|
|
52
|
+
|
|
53
|
+
### Secondary/Logo Typefaces in Artwork
|
|
54
|
+
- **Founders Grotesk** appears in some logo lockup variants
|
|
55
|
+
- **Atkinson Hyperlegible** appears in small-size logo lockup construction
|
|
56
|
+
|
|
57
|
+
These two are used in logo artwork examples, while content typography guidance is built around Poppins.
|
|
58
|
+
|
|
59
|
+
## 4) Type Hierarchy (Explicit Specs)
|
|
60
|
+
|
|
61
|
+
From the “Type Hierarchy” page:
|
|
62
|
+
|
|
63
|
+
1. **Headline 1**
|
|
64
|
+
- Font: Poppins Regular
|
|
65
|
+
- Size/Line-height: `56pt / 64pt`
|
|
66
|
+
- Tracking: `-4%`
|
|
67
|
+
|
|
68
|
+
2. **Headline 2**
|
|
69
|
+
- Font: Poppins Regular
|
|
70
|
+
- Size/Line-height: `40pt / 48pt`
|
|
71
|
+
- Tracking: `-4%`
|
|
72
|
+
|
|
73
|
+
3. **Headline 3**
|
|
74
|
+
- Font: Poppins Medium
|
|
75
|
+
- Size/Line-height: `36pt / 42pt`
|
|
76
|
+
- Tracking: `-4%`
|
|
77
|
+
|
|
78
|
+
4. **Headline 4**
|
|
79
|
+
- Font: Poppins Bold
|
|
80
|
+
- Size/Line-height: `28pt / 36pt`
|
|
81
|
+
- Tracking: `-2%`
|
|
82
|
+
|
|
83
|
+
5. **Subheadline**
|
|
84
|
+
- Font: Poppins Regular
|
|
85
|
+
- Size/Line-height: `24pt / 32pt`
|
|
86
|
+
- Tracking: `-4%`
|
|
87
|
+
|
|
88
|
+
Observations:
|
|
89
|
+
- Hierarchy keeps a tight, modern tracking style (negative spacing) across all headline levels.
|
|
90
|
+
- Tone is editorial/brand-led rather than utility UI typography.
|
|
91
|
+
|
|
92
|
+
## 5) Logo System
|
|
93
|
+
|
|
94
|
+
The file includes several distinct logo applications:
|
|
95
|
+
|
|
96
|
+
### A) Full lockup (symbol + “Floors Finance”)
|
|
97
|
+
Shown on light and dark backgrounds.
|
|
98
|
+
|
|
99
|
+
- Dark background version: white logo elements
|
|
100
|
+
- Light background version: dark green/navy logo elements (`#06211A` family)
|
|
101
|
+
|
|
102
|
+
### B) Wordmark lockup (symbol + “Floors”)
|
|
103
|
+
Also shown in both positive and negative versions.
|
|
104
|
+
|
|
105
|
+
### C) Symbol-only mark
|
|
106
|
+
Displayed across shape containers:
|
|
107
|
+
- Square
|
|
108
|
+
- Rounded square
|
|
109
|
+
- Circle
|
|
110
|
+
|
|
111
|
+
Each shape is shown in:
|
|
112
|
+
- Reverse mode (light symbol on dark base)
|
|
113
|
+
- Standard mode (dark symbol on light base)
|
|
114
|
+
|
|
115
|
+
### D) Standalone symbol examples
|
|
116
|
+
Large hero-style mark applications on both dark and light bars.
|
|
117
|
+
|
|
118
|
+
### Minimum Size Rule
|
|
119
|
+
The guideline explicitly states:
|
|
120
|
+
- **Smallest logo size: `152px / 50px`**
|
|
121
|
+
|
|
122
|
+
Use this as the minimum for the horizontal lockup to preserve legibility.
|
|
123
|
+
|
|
124
|
+
## 6) Backgrounds, Contrast, and Composition
|
|
125
|
+
|
|
126
|
+
Global visual behavior across pages:
|
|
127
|
+
- Large dark chapter openers with oversized type and subtle geometric overlays
|
|
128
|
+
- Content pages switch to very light neutral surfaces (`#F2F2F2` / Platinum-like context)
|
|
129
|
+
- Strong contrast pairings are used consistently:
|
|
130
|
+
- Light-on-dark for hero/cover/section openers
|
|
131
|
+
- Dark-on-light for content and palette documentation
|
|
132
|
+
|
|
133
|
+
The geometric symbol is reused as a low-opacity decorative motif in section opener backgrounds and cover.
|
|
134
|
+
|
|
135
|
+
## 7) Brand Voice Implied by Visual System
|
|
136
|
+
|
|
137
|
+
The visual system communicates:
|
|
138
|
+
- Trust and stability (deep dark base + minimal layout)
|
|
139
|
+
- Modernity and clarity (clean sans-serif typography, sparse composition)
|
|
140
|
+
- Energy and friendliness (Mint/Tangerine accents)
|
|
141
|
+
|
|
142
|
+
## 8) Production Notes for Designers and Developers
|
|
143
|
+
|
|
144
|
+
### Recommended tokenization (implementation-ready)
|
|
145
|
+
- `color.brand.nighty = #101114`
|
|
146
|
+
- `color.brand.mint = #BEFFB0`
|
|
147
|
+
- `color.brand.tangerine = #FFB651`
|
|
148
|
+
- `color.neutral.white = #FFFFFF`
|
|
149
|
+
- `color.neutral.platinum = #F4F4F5`
|
|
150
|
+
- `font.family.primary = "Poppins", sans-serif`
|
|
151
|
+
|
|
152
|
+
### Suggested usage guardrails
|
|
153
|
+
- Keep headline tracking visually tight (matching guideline intent)
|
|
154
|
+
- Prefer full lockup logo where horizontal room is available
|
|
155
|
+
- Use symbol-only mark for compact surfaces (avatar, icon tile, social image marks)
|
|
156
|
+
- Never scale the full logo below `152x50`
|
|
157
|
+
|
|
158
|
+
## 9) What Is Explicitly Not Defined in the File
|
|
159
|
+
|
|
160
|
+
The `.pen` guideline does **not** explicitly provide:
|
|
161
|
+
- Logo clear-space formula
|
|
162
|
+
- Misuse examples (“don’t stretch/rotate/recolor” page)
|
|
163
|
+
- Accessibility contrast ratio requirements (WCAG values)
|
|
164
|
+
- UI component-level rules (buttons/forms/cards)
|
|
165
|
+
- Motion/animation guidance
|
|
166
|
+
|
|
167
|
+
If needed, these should be added as a Phase 2 brand system extension.
|
|
168
|
+
|
|
169
|
+
## 10) Local Asset Library (Fonts and Logos)
|
|
170
|
+
|
|
171
|
+
The following assets are available in the local project folder and should be treated as the production source files.
|
|
172
|
+
|
|
173
|
+
### Fonts
|
|
174
|
+
|
|
175
|
+
Location: `Fonts/Poppins/`
|
|
176
|
+
|
|
177
|
+
Available files:
|
|
178
|
+
- `Poppins-Thin.ttf`
|
|
179
|
+
- `Poppins-ThinItalic.ttf`
|
|
180
|
+
- `Poppins-ExtraLight.ttf`
|
|
181
|
+
- `Poppins-ExtraLightItalic.ttf`
|
|
182
|
+
- `Poppins-Light.ttf`
|
|
183
|
+
- `Poppins-LightItalic.ttf`
|
|
184
|
+
- `Poppins-Regular.ttf`
|
|
185
|
+
- `Poppins-Italic.ttf`
|
|
186
|
+
- `Poppins-Medium.ttf`
|
|
187
|
+
- `Poppins-MediumItalic.ttf`
|
|
188
|
+
- `Poppins-SemiBold.ttf`
|
|
189
|
+
- `Poppins-SemiBoldItalic.ttf`
|
|
190
|
+
- `Poppins-Bold.ttf`
|
|
191
|
+
- `Poppins-BoldItalic.ttf`
|
|
192
|
+
- `Poppins-ExtraBold.ttf`
|
|
193
|
+
- `Poppins-ExtraBoldItalic.ttf`
|
|
194
|
+
- `Poppins-Black.ttf`
|
|
195
|
+
- `Poppins-BlackItalic.ttf`
|
|
196
|
+
|
|
197
|
+
### Logo Assets
|
|
198
|
+
|
|
199
|
+
Raster logos (PNG) are in:
|
|
200
|
+
- `Logos/PNG/Dark/`
|
|
201
|
+
- `Logos/PNG/Light/`
|
|
202
|
+
|
|
203
|
+
Vector logos (SVG) are in:
|
|
204
|
+
- `Logos/SVG/Dark/`
|
|
205
|
+
- `Logos/SVG/Light/`
|
|
206
|
+
|
|
207
|
+
Included variants cover:
|
|
208
|
+
- Full logo lockup
|
|
209
|
+
- Logotype-only lockup
|
|
210
|
+
- Symbol-only mark
|
|
211
|
+
- Background-specific exports (`Dark BG`, `Light BG`)
|
|
212
|
+
|
|
213
|
+
### Asset Usage Rules
|
|
214
|
+
|
|
215
|
+
- Prefer `SVG` for web, product UI, documents, and print where possible.
|
|
216
|
+
- Use `PNG` for tools/platforms that do not handle vector assets.
|
|
217
|
+
- Use files from `Dark` folders on light backgrounds.
|
|
218
|
+
- Use files from `Light` folders on dark backgrounds.
|
|
219
|
+
- Keep original proportions and never stretch logo files.
|
|
220
|
+
- Respect the minimum lockup size from the guideline: `152x50` px.
|
|
221
|
+
|
|
222
|
+
### Naming Notes
|
|
223
|
+
|
|
224
|
+
There is minor naming inconsistency in supplied files, for example:
|
|
225
|
+
- `Floor Logo Light.svg` vs `Floors Logo Light.png`
|
|
226
|
+
- `Floors Logotype light.png` (lowercase `light`)
|
|
227
|
+
|
|
228
|
+
Recommendation:
|
|
229
|
+
- Keep originals untouched for traceability.
|
|
230
|
+
- Add a normalized naming convention in future (for example: `floors-logo-full-light.svg`, `floors-symbol-darkbg.png`).
|
|
231
|
+
|
|
232
|
+
## 11) Page Inventory (for traceability)
|
|
233
|
+
|
|
234
|
+
Top-level frames in `Brand Guidelines.pen`:
|
|
235
|
+
1. `QC64a` - Brand Identity (cover)
|
|
236
|
+
2. `ChdkS` - Typography Chapter Opener
|
|
237
|
+
3. `vKRP9` - Colors Chapter Opener
|
|
238
|
+
4. `fOJcy` - Logo Chapter Opener
|
|
239
|
+
5. `ouwYR` - Content Section: Typography
|
|
240
|
+
6. `XZ6vj` - Content Section: Type Hierarchy
|
|
241
|
+
7. `LLs8O` - Content Section: Colour Palette
|
|
242
|
+
8. `TxJX3` - Content Section: Logo (full lockup)
|
|
243
|
+
9. `Rm3H4` - Content Section: Logo (symbol in containers)
|
|
244
|
+
10. `14t8U` - Content Section: Logo (Floors lockup)
|
|
245
|
+
11. `3gXy3` - Content Section: Logo (symbol standalone)
|
|
246
|
+
|
|
247
|
+
---
|
|
248
|
+
|
|
249
|
+
Prepared from direct inspection of `Brand Guidelines.pen` structure, style values, visual frames, and local asset folders (`Fonts/`, `Logos/`).
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
<svg width="385" height="93" viewBox="0 0 385 93" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<g clip-path="url(#clip0_958_5977)">
|
|
3
|
+
<path d="M111.3 46.0555L89.0397 57.569L44.521 34.542L89.0397 11.5137V34.542L111.3 46.0555Z" fill="white"/>
|
|
4
|
+
<path d="M89.0384 80.596L66.7791 92.1095L-0.000244141 57.569L44.5197 34.542V57.569L89.0384 80.596Z" fill="white"/>
|
|
5
|
+
<path d="M89.0393 11.5135L111.3 0L133.559 11.5135L111.3 23.027L89.0393 11.5135Z" fill="white"/>
|
|
6
|
+
</g>
|
|
7
|
+
<path d="M162.213 74.5547H150.981V17.946H191.505V27.291H162.213V42.3866H184.856V51.5518H162.213V74.5547ZM199.08 17.946H209.863V74.5547H199.08V17.946ZM228.346 54.7866C228.346 62.2446 231.76 67.4561 238.32 67.4561C244.969 67.4561 248.384 62.2446 248.384 54.7866C248.384 47.2388 244.969 42.0272 238.32 42.0272C231.76 42.0272 228.346 47.2388 228.346 54.7866ZM259.256 54.7866C259.256 67.0967 250.63 75.6329 238.32 75.6329C226.1 75.6329 217.474 67.0967 217.474 54.7866C217.474 42.4765 226.1 33.8504 238.32 33.8504C250.63 33.8504 259.256 42.4765 259.256 54.7866ZM275.752 54.7866C275.752 62.2446 279.166 67.4561 285.725 67.4561C292.375 67.4561 295.789 62.2446 295.789 54.7866C295.789 47.2388 292.375 42.0272 285.725 42.0272C279.166 42.0272 275.752 47.2388 275.752 54.7866ZM306.662 54.7866C306.662 67.0967 298.036 75.6329 285.725 75.6329C273.505 75.6329 264.879 67.0967 264.879 54.7866C264.879 42.4765 273.505 33.8504 285.725 33.8504C298.036 33.8504 306.662 42.4765 306.662 54.7866ZM341.763 35.4678L340.955 45.5315C338.888 44.3634 337.091 43.8243 334.485 43.8243C328.914 43.8243 325.14 47.7779 325.14 54.9663V74.5547H314.358V34.9286H325.14V42.4765C326.578 37.9837 330.711 33.8504 336.192 33.8504C338.618 33.8504 340.595 34.4794 341.763 35.4678ZM344.672 61.4359L354.017 61.0764C354.646 65.8388 358.241 68.2648 363.722 68.2648C367.675 68.2648 370.91 66.917 370.91 64.0417C370.91 61.346 369.113 60.1779 365.159 59.5489L358.869 58.4706C350.423 57.1228 345.751 53.9779 345.751 46.6098C345.751 39.062 352.13 33.8504 362.194 33.8504C373.156 33.8504 379.716 38.7924 380.435 47.5982L371.539 47.9576C370.82 43.4649 367.765 41.2185 362.104 41.2185C358.241 41.2185 355.725 42.9257 355.725 45.6214C355.725 47.7779 357.162 49.0359 360.038 49.4851L367.585 50.7431C375.942 52.0909 380.884 55.5953 380.884 63.0532C380.884 71.1402 373.875 75.6329 363.632 75.6329C353.298 75.6329 345.391 71.1402 344.672 61.4359Z" fill="white"/>
|
|
8
|
+
<defs>
|
|
9
|
+
<clipPath id="clip0_958_5977">
|
|
10
|
+
<rect width="133.559" height="92.1094" fill="white"/>
|
|
11
|
+
</clipPath>
|
|
12
|
+
</defs>
|
|
13
|
+
</svg>
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
<svg width="385" height="93" viewBox="0 0 385 93" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<g clip-path="url(#clip0_958_5993)">
|
|
3
|
+
<path d="M111.3 46.0555L89.0397 57.569L44.521 34.542L89.0397 11.5137V34.542L111.3 46.0555Z" fill="#101114"/>
|
|
4
|
+
<path d="M89.0384 80.596L66.7791 92.1095L-0.000244141 57.569L44.5197 34.542V57.569L89.0384 80.596Z" fill="#101114"/>
|
|
5
|
+
<path d="M89.0393 11.5135L111.3 0L133.559 11.5135L111.3 23.027L89.0393 11.5135Z" fill="#101114"/>
|
|
6
|
+
</g>
|
|
7
|
+
<path d="M162.212 74.5547H150.981V17.946H191.505V27.291H162.212V42.3866H184.856V51.5518H162.212V74.5547ZM199.08 17.946H209.862V74.5547H199.08V17.946ZM228.346 54.7866C228.346 62.2446 231.76 67.4561 238.32 67.4561C244.969 67.4561 248.383 62.2446 248.383 54.7866C248.383 47.2388 244.969 42.0272 238.32 42.0272C231.76 42.0272 228.346 47.2388 228.346 54.7866ZM259.256 54.7866C259.256 67.0967 250.63 75.6329 238.32 75.6329C226.099 75.6329 217.473 67.0967 217.473 54.7866C217.473 42.4765 226.099 33.8504 238.32 33.8504C250.63 33.8504 259.256 42.4765 259.256 54.7866ZM275.751 54.7866C275.751 62.2446 279.166 67.4561 285.725 67.4561C292.374 67.4561 295.789 62.2446 295.789 54.7866C295.789 47.2388 292.374 42.0272 285.725 42.0272C279.166 42.0272 275.751 47.2388 275.751 54.7866ZM306.661 54.7866C306.661 67.0967 298.035 75.6329 285.725 75.6329C273.505 75.6329 264.879 67.0967 264.879 54.7866C264.879 42.4765 273.505 33.8504 285.725 33.8504C298.035 33.8504 306.661 42.4765 306.661 54.7866ZM341.763 35.4678L340.954 45.5315C338.888 44.3634 337.091 43.8243 334.485 43.8243C328.914 43.8243 325.14 47.7779 325.14 54.9663V74.5547H314.357V34.9286H325.14V42.4765C326.578 37.9837 330.711 33.8504 336.192 33.8504C338.618 33.8504 340.595 34.4794 341.763 35.4678ZM344.672 61.4359L354.017 61.0764C354.646 65.8388 358.24 68.2648 363.721 68.2648C367.675 68.2648 370.91 66.917 370.91 64.0417C370.91 61.346 369.113 60.1779 365.159 59.5489L358.869 58.4706C350.423 57.1228 345.75 53.9779 345.75 46.6098C345.75 39.062 352.13 33.8504 362.194 33.8504C373.156 33.8504 379.716 38.7924 380.434 47.5982L371.539 47.9576C370.82 43.4649 367.765 41.2185 362.104 41.2185C358.24 41.2185 355.724 42.9257 355.724 45.6214C355.724 47.7779 357.162 49.0359 360.037 49.4851L367.585 50.7431C375.942 52.0909 380.884 55.5953 380.884 63.0532C380.884 71.1402 373.875 75.6329 363.632 75.6329C353.298 75.6329 345.391 71.1402 344.672 61.4359Z" fill="#101114"/>
|
|
8
|
+
<defs>
|
|
9
|
+
<clipPath id="clip0_958_5993">
|
|
10
|
+
<rect width="133.559" height="92.1094" fill="white"/>
|
|
11
|
+
</clipPath>
|
|
12
|
+
</defs>
|
|
13
|
+
</svg>
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
<svg width="238" height="59" viewBox="0 0 238 59" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path d="M16.1739 57H4.94203V0.391348H45.4666V9.73627H16.1739V24.8319H38.8174V33.9971H16.1739V57ZM53.0411 0.391348H63.8237V57H53.0411V0.391348ZM82.3072 37.2319C82.3072 44.6899 85.7217 49.9015 92.2811 49.9015C98.9304 49.9015 102.345 44.6899 102.345 37.2319C102.345 29.6841 98.9304 24.4725 92.2811 24.4725C85.7217 24.4725 82.3072 29.6841 82.3072 37.2319ZM113.217 37.2319C113.217 49.542 104.591 58.0783 92.2811 58.0783C80.0608 58.0783 71.4347 49.542 71.4347 37.2319C71.4347 24.9218 80.0608 16.2957 92.2811 16.2957C104.591 16.2957 113.217 24.9218 113.217 37.2319ZM129.713 37.2319C129.713 44.6899 133.127 49.9015 139.687 49.9015C146.336 49.9015 149.75 44.6899 149.75 37.2319C149.75 29.6841 146.336 24.4725 139.687 24.4725C133.127 24.4725 129.713 29.6841 129.713 37.2319ZM160.623 37.2319C160.623 49.542 151.997 58.0783 139.687 58.0783C127.466 58.0783 118.84 49.542 118.84 37.2319C118.84 24.9218 127.466 16.2957 139.687 16.2957C151.997 16.2957 160.623 24.9218 160.623 37.2319ZM195.725 17.9131L194.916 27.9768C192.849 26.8087 191.052 26.2696 188.446 26.2696C182.875 26.2696 179.101 30.2232 179.101 37.4116V57H168.319V17.3739H179.101V24.9218C180.539 20.429 184.672 16.2957 190.154 16.2957C192.58 16.2957 194.556 16.9247 195.725 17.9131ZM198.634 43.8812L207.979 43.5218C208.607 48.2841 212.202 50.7102 217.683 50.7102C221.636 50.7102 224.871 49.3623 224.871 46.487C224.871 43.7913 223.074 42.6232 219.121 41.9942L212.831 40.916C204.384 39.5681 199.712 36.4232 199.712 29.0551C199.712 21.5073 206.092 16.2957 216.155 16.2957C227.118 16.2957 233.677 21.2377 234.396 30.0435L225.5 30.4029C224.781 25.9102 221.726 23.6638 216.065 23.6638C212.202 23.6638 209.686 25.371 209.686 28.0667C209.686 30.2232 211.123 31.4812 213.999 31.9305L221.547 33.1884C229.903 34.5363 234.845 38.0406 234.845 45.4986C234.845 53.5855 227.836 58.0783 217.593 58.0783C207.26 58.0783 199.352 53.5855 198.634 43.8812Z" fill="#101114"/>
|
|
3
|
+
</svg>
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
<svg width="238" height="59" viewBox="0 0 238 59" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path d="M16.1739 57H4.94203V0.391348H45.4666V9.73627H16.1739V24.8319H38.8174V33.9971H16.1739V57ZM53.0411 0.391348H63.8237V57H53.0411V0.391348ZM82.3072 37.2319C82.3072 44.6899 85.7217 49.9015 92.2811 49.9015C98.9304 49.9015 102.345 44.6899 102.345 37.2319C102.345 29.6841 98.9304 24.4725 92.2811 24.4725C85.7217 24.4725 82.3072 29.6841 82.3072 37.2319ZM113.217 37.2319C113.217 49.542 104.591 58.0783 92.2811 58.0783C80.0608 58.0783 71.4347 49.542 71.4347 37.2319C71.4347 24.9218 80.0608 16.2957 92.2811 16.2957C104.591 16.2957 113.217 24.9218 113.217 37.2319ZM129.713 37.2319C129.713 44.6899 133.127 49.9015 139.687 49.9015C146.336 49.9015 149.75 44.6899 149.75 37.2319C149.75 29.6841 146.336 24.4725 139.687 24.4725C133.127 24.4725 129.713 29.6841 129.713 37.2319ZM160.623 37.2319C160.623 49.542 151.997 58.0783 139.687 58.0783C127.466 58.0783 118.84 49.542 118.84 37.2319C118.84 24.9218 127.466 16.2957 139.687 16.2957C151.997 16.2957 160.623 24.9218 160.623 37.2319ZM195.725 17.9131L194.916 27.9768C192.849 26.8087 191.052 26.2696 188.446 26.2696C182.875 26.2696 179.101 30.2232 179.101 37.4116V57H168.319V17.3739H179.101V24.9218C180.539 20.429 184.672 16.2957 190.154 16.2957C192.58 16.2957 194.556 16.9247 195.725 17.9131ZM198.634 43.8812L207.979 43.5218C208.607 48.2841 212.202 50.7102 217.683 50.7102C221.636 50.7102 224.871 49.3623 224.871 46.487C224.871 43.7913 223.074 42.6232 219.121 41.9942L212.831 40.916C204.384 39.5681 199.712 36.4232 199.712 29.0551C199.712 21.5073 206.092 16.2957 216.155 16.2957C227.118 16.2957 233.677 21.2377 234.396 30.0435L225.5 30.4029C224.781 25.9102 221.726 23.6638 216.065 23.6638C212.202 23.6638 209.686 25.371 209.686 28.0667C209.686 30.2232 211.123 31.4812 213.999 31.9305L221.547 33.1884C229.903 34.5363 234.845 38.0406 234.845 45.4986C234.845 53.5855 227.836 58.0783 217.593 58.0783C207.26 58.0783 199.352 53.5855 198.634 43.8812Z" fill="white"/>
|
|
3
|
+
</svg>
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
<svg width="134" height="93" viewBox="0 0 134 93" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<g clip-path="url(#clip0_958_5994)">
|
|
3
|
+
<path d="M111.3 46.0555L89.0397 57.569L44.521 34.542L89.0397 11.5137V34.542L111.3 46.0555Z" fill="#101114"/>
|
|
4
|
+
<path d="M89.0384 80.596L66.7791 92.1095L-0.000244141 57.569L44.5197 34.542V57.569L89.0384 80.596Z" fill="#101114"/>
|
|
5
|
+
<path d="M89.0393 11.5135L111.3 0L133.559 11.5135L111.3 23.027L89.0393 11.5135Z" fill="#101114"/>
|
|
6
|
+
</g>
|
|
7
|
+
<defs>
|
|
8
|
+
<clipPath id="clip0_958_5994">
|
|
9
|
+
<rect width="133.559" height="92.1094" fill="white"/>
|
|
10
|
+
</clipPath>
|
|
11
|
+
</defs>
|
|
12
|
+
</svg>
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
<svg width="134" height="93" viewBox="0 0 134 93" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<g clip-path="url(#clip0_958_5978)">
|
|
3
|
+
<path d="M111.3 46.0555L89.0397 57.569L44.521 34.542L89.0397 11.5137V34.542L111.3 46.0555Z" fill="white"/>
|
|
4
|
+
<path d="M89.0384 80.596L66.7791 92.1095L-0.000244141 57.569L44.5197 34.542V57.569L89.0384 80.596Z" fill="white"/>
|
|
5
|
+
<path d="M89.0393 11.5135L111.3 0L133.559 11.5135L111.3 23.027L89.0393 11.5135Z" fill="white"/>
|
|
6
|
+
</g>
|
|
7
|
+
<defs>
|
|
8
|
+
<clipPath id="clip0_958_5978">
|
|
9
|
+
<rect width="133.559" height="92.1094" fill="white"/>
|
|
10
|
+
</clipPath>
|
|
11
|
+
</defs>
|
|
12
|
+
</svg>
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
<svg width="424" height="424" viewBox="0 0 424 424" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<g filter="url(#filter0_ii_2499_795)">
|
|
3
|
+
<rect width="424" height="424" fill="#101114"/>
|
|
4
|
+
</g>
|
|
5
|
+
<g clip-path="url(#clip0_2499_795)">
|
|
6
|
+
<path d="M131.281 212.001L109.02 223.515L64.5015 200.488L109.02 177.459V200.488L131.281 212.001Z" fill="white"/>
|
|
7
|
+
<path d="M109.019 246.541L86.7598 258.055L19.9805 223.514L64.5004 200.487V223.514L109.019 246.541Z" fill="white"/>
|
|
8
|
+
<path d="M109.02 177.459L131.28 165.945L153.54 177.459L131.28 188.972L109.02 177.459Z" fill="white"/>
|
|
9
|
+
</g>
|
|
10
|
+
<path d="M182.193 240.5H170.961V183.891H211.486V193.236H182.193V208.332H204.836V217.497H182.193V240.5ZM219.06 183.891H229.843V240.5H219.06V183.891ZM248.326 220.732C248.326 228.19 251.741 233.401 258.3 233.401C264.949 233.401 268.364 228.19 268.364 220.732C268.364 213.184 264.949 207.972 258.3 207.972C251.741 207.972 248.326 213.184 248.326 220.732ZM279.236 220.732C279.236 233.042 270.61 241.578 258.3 241.578C246.08 241.578 237.454 233.042 237.454 220.732C237.454 208.422 246.08 199.796 258.3 199.796C270.61 199.796 279.236 208.422 279.236 220.732ZM295.732 220.732C295.732 228.19 299.146 233.401 305.706 233.401C312.355 233.401 315.769 228.19 315.769 220.732C315.769 213.184 312.355 207.972 305.706 207.972C299.146 207.972 295.732 213.184 295.732 220.732ZM326.642 220.732C326.642 233.042 318.016 241.578 305.706 241.578C293.485 241.578 284.859 233.042 284.859 220.732C284.859 208.422 293.485 199.796 305.706 199.796C318.016 199.796 326.642 208.422 326.642 220.732ZM361.744 201.413L360.935 211.477C358.868 210.309 357.071 209.77 354.465 209.77C348.894 209.77 345.12 213.723 345.12 220.912V240.5H334.338V200.874H345.12V208.422C346.558 203.929 350.691 199.796 356.173 199.796C358.599 199.796 360.575 200.425 361.744 201.413ZM364.653 227.381L373.998 227.022C374.627 231.784 378.221 234.21 383.702 234.21C387.656 234.21 390.89 232.862 390.89 229.987C390.89 227.291 389.093 226.123 385.14 225.494L378.85 224.416C370.403 223.068 365.731 219.923 365.731 212.555C365.731 205.007 372.111 199.796 382.174 199.796C393.137 199.796 399.696 204.738 400.415 213.544L391.519 213.903C390.8 209.41 387.745 207.164 382.085 207.164C378.221 207.164 375.705 208.871 375.705 211.567C375.705 213.723 377.142 214.981 380.018 215.43L387.566 216.688C395.922 218.036 400.864 221.541 400.864 228.999C400.864 237.086 393.856 241.578 383.612 241.578C373.279 241.578 365.371 237.086 364.653 227.381Z" fill="white"/>
|
|
11
|
+
<defs>
|
|
12
|
+
<filter id="filter0_ii_2499_795" x="0" y="0" width="424" height="448" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
|
13
|
+
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
|
14
|
+
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
|
|
15
|
+
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
|
16
|
+
<feOffset dy="24"/>
|
|
17
|
+
<feGaussianBlur stdDeviation="28"/>
|
|
18
|
+
<feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
|
|
19
|
+
<feColorMatrix type="matrix" values="0 0 0 0 0.658824 0 0 0 0 0.847059 0 0 0 0 0.960784 0 0 0 0.06 0"/>
|
|
20
|
+
<feBlend mode="normal" in2="shape" result="effect1_innerShadow_2499_795"/>
|
|
21
|
+
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
|
22
|
+
<feOffset dy="1"/>
|
|
23
|
+
<feGaussianBlur stdDeviation="1"/>
|
|
24
|
+
<feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
|
|
25
|
+
<feColorMatrix type="matrix" values="0 0 0 0 0.847059 0 0 0 0 0.92549 0 0 0 0 0.972549 0 0 0 0.2 0"/>
|
|
26
|
+
<feBlend mode="normal" in2="effect1_innerShadow_2499_795" result="effect2_innerShadow_2499_795"/>
|
|
27
|
+
</filter>
|
|
28
|
+
<clipPath id="clip0_2499_795">
|
|
29
|
+
<rect width="133.559" height="92.1094" fill="white" transform="translate(19.9805 165.945)"/>
|
|
30
|
+
</clipPath>
|
|
31
|
+
</defs>
|
|
32
|
+
</svg>
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
<svg width="424" height="424" viewBox="0 0 424 424" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<g filter="url(#filter0_ii_2499_786)">
|
|
3
|
+
<rect width="424" height="424" fill="white"/>
|
|
4
|
+
</g>
|
|
5
|
+
<g clip-path="url(#clip0_2499_786)">
|
|
6
|
+
<path d="M131.281 212.001L109.02 223.515L64.5015 200.488L109.02 177.459V200.488L131.281 212.001Z" fill="#101114"/>
|
|
7
|
+
<path d="M109.019 246.541L86.7598 258.055L19.9805 223.514L64.5004 200.487V223.514L109.019 246.541Z" fill="#101114"/>
|
|
8
|
+
<path d="M109.02 177.459L131.28 165.945L153.54 177.459L131.28 188.972L109.02 177.459Z" fill="#101114"/>
|
|
9
|
+
</g>
|
|
10
|
+
<path d="M182.193 240.5H170.961V183.891H211.486V193.236H182.193V208.332H204.836V217.497H182.193V240.5ZM219.06 183.891H229.843V240.5H219.06V183.891ZM248.326 220.732C248.326 228.19 251.741 233.401 258.3 233.401C264.949 233.401 268.364 228.19 268.364 220.732C268.364 213.184 264.949 207.972 258.3 207.972C251.741 207.972 248.326 213.184 248.326 220.732ZM279.236 220.732C279.236 233.042 270.61 241.578 258.3 241.578C246.08 241.578 237.454 233.042 237.454 220.732C237.454 208.422 246.08 199.796 258.3 199.796C270.61 199.796 279.236 208.422 279.236 220.732ZM295.732 220.732C295.732 228.19 299.146 233.401 305.706 233.401C312.355 233.401 315.769 228.19 315.769 220.732C315.769 213.184 312.355 207.972 305.706 207.972C299.146 207.972 295.732 213.184 295.732 220.732ZM326.642 220.732C326.642 233.042 318.016 241.578 305.706 241.578C293.485 241.578 284.859 233.042 284.859 220.732C284.859 208.422 293.485 199.796 305.706 199.796C318.016 199.796 326.642 208.422 326.642 220.732ZM361.744 201.413L360.935 211.477C358.868 210.309 357.071 209.77 354.465 209.77C348.894 209.77 345.12 213.723 345.12 220.912V240.5H334.338V200.874H345.12V208.422C346.558 203.929 350.691 199.796 356.173 199.796C358.599 199.796 360.575 200.425 361.744 201.413ZM364.653 227.381L373.998 227.022C374.627 231.784 378.221 234.21 383.702 234.21C387.656 234.21 390.89 232.862 390.89 229.987C390.89 227.291 389.093 226.123 385.14 225.494L378.85 224.416C370.403 223.068 365.731 219.923 365.731 212.555C365.731 205.007 372.111 199.796 382.174 199.796C393.137 199.796 399.696 204.738 400.415 213.544L391.519 213.903C390.8 209.41 387.745 207.164 382.085 207.164C378.221 207.164 375.705 208.871 375.705 211.567C375.705 213.723 377.142 214.981 380.018 215.43L387.566 216.688C395.922 218.036 400.864 221.541 400.864 228.999C400.864 237.086 393.856 241.578 383.612 241.578C373.279 241.578 365.371 237.086 364.653 227.381Z" fill="#101114"/>
|
|
11
|
+
<defs>
|
|
12
|
+
<filter id="filter0_ii_2499_786" x="0" y="0" width="424" height="448" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
|
13
|
+
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
|
14
|
+
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
|
|
15
|
+
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
|
16
|
+
<feOffset dy="24"/>
|
|
17
|
+
<feGaussianBlur stdDeviation="28"/>
|
|
18
|
+
<feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
|
|
19
|
+
<feColorMatrix type="matrix" values="0 0 0 0 0.658824 0 0 0 0 0.847059 0 0 0 0 0.960784 0 0 0 0.06 0"/>
|
|
20
|
+
<feBlend mode="normal" in2="shape" result="effect1_innerShadow_2499_786"/>
|
|
21
|
+
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
|
22
|
+
<feOffset dy="1"/>
|
|
23
|
+
<feGaussianBlur stdDeviation="1"/>
|
|
24
|
+
<feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
|
|
25
|
+
<feColorMatrix type="matrix" values="0 0 0 0 0.847059 0 0 0 0 0.92549 0 0 0 0 0.972549 0 0 0 0.2 0"/>
|
|
26
|
+
<feBlend mode="normal" in2="effect1_innerShadow_2499_786" result="effect2_innerShadow_2499_786"/>
|
|
27
|
+
</filter>
|
|
28
|
+
<clipPath id="clip0_2499_786">
|
|
29
|
+
<rect width="133.559" height="92.1094" fill="white" transform="translate(19.9805 165.945)"/>
|
|
30
|
+
</clipPath>
|
|
31
|
+
</defs>
|
|
32
|
+
</svg>
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
<svg width="424" height="424" viewBox="0 0 424 424" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<rect width="424" height="424" fill="#101114"/>
|
|
3
|
+
<g clip-path="url(#clip0_1683_14)">
|
|
4
|
+
<path d="M297.409 212.001L254.703 233.353L169.296 190.65L254.703 147.943V190.65L297.409 212.001Z" fill="white"/>
|
|
5
|
+
<path d="M254.703 276.056L211.999 297.408L83.8857 233.353L169.296 190.649V233.353L254.703 276.056Z" fill="white"/>
|
|
6
|
+
<path d="M254.703 147.943L297.409 126.591L340.113 147.943L297.409 169.295L254.703 147.943Z" fill="white"/>
|
|
7
|
+
</g>
|
|
8
|
+
<defs>
|
|
9
|
+
<clipPath id="clip0_1683_14">
|
|
10
|
+
<rect width="256.227" height="170.817" fill="white" transform="translate(83.8857 126.591)"/>
|
|
11
|
+
</clipPath>
|
|
12
|
+
</defs>
|
|
13
|
+
</svg>
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
<svg width="424" height="424" viewBox="0 0 424 424" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<rect width="424" height="424" fill="white"/>
|
|
3
|
+
<g clip-path="url(#clip0_1683_41)">
|
|
4
|
+
<path d="M297.409 212.001L254.703 233.353L169.296 190.65L254.703 147.943V190.65L297.409 212.001Z" fill="#101114"/>
|
|
5
|
+
<path d="M254.703 276.056L211.999 297.408L83.8857 233.353L169.296 190.649V233.353L254.703 276.056Z" fill="#101114"/>
|
|
6
|
+
<path d="M254.703 147.943L297.409 126.591L340.113 147.943L297.409 169.295L254.703 147.943Z" fill="#101114"/>
|
|
7
|
+
</g>
|
|
8
|
+
<defs>
|
|
9
|
+
<clipPath id="clip0_1683_41">
|
|
10
|
+
<rect width="256.227" height="170.817" fill="white" transform="translate(83.8857 126.591)"/>
|
|
11
|
+
</clipPath>
|
|
12
|
+
</defs>
|
|
13
|
+
</svg>
|
package/package.json
ADDED
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "floors-brand-assets",
|
|
3
|
+
"version": "1.0.0",
|
|
4
|
+
"description": "Official brand assets for Floors Finance — modern DeFi/fintech platform",
|
|
5
|
+
"main": "colors/index.js",
|
|
6
|
+
"types": "colors/index.ts",
|
|
7
|
+
"files": [
|
|
8
|
+
"colors",
|
|
9
|
+
"logos",
|
|
10
|
+
"fonts",
|
|
11
|
+
"guidelines.md",
|
|
12
|
+
"README.md"
|
|
13
|
+
],
|
|
14
|
+
"scripts": {
|
|
15
|
+
"test": "echo \"No tests specified\""
|
|
16
|
+
},
|
|
17
|
+
"keywords": [
|
|
18
|
+
"floors",
|
|
19
|
+
"finance",
|
|
20
|
+
"brand",
|
|
21
|
+
"design-system",
|
|
22
|
+
"defi",
|
|
23
|
+
"fintech"
|
|
24
|
+
],
|
|
25
|
+
"author": "Floors Finance",
|
|
26
|
+
"license": "MIT",
|
|
27
|
+
"repository": {
|
|
28
|
+
"type": "git",
|
|
29
|
+
"url": "https://github.com/floorsfinance/brand-assets.git"
|
|
30
|
+
}
|
|
31
|
+
}
|