@glyphjs/brand 0.1.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/LICENSE +21 -0
- package/dist/index.cjs +157 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.cts +69 -0
- package/dist/index.d.ts +69 -0
- package/dist/index.js +149 -0
- package/dist/index.js.map +1 -0
- package/package.json +55 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2025 Glyph JS Contributors
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/dist/index.cjs
ADDED
|
@@ -0,0 +1,157 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var react = require('react');
|
|
4
|
+
|
|
5
|
+
// src/logos/logomark.ts
|
|
6
|
+
var logomarkSvg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" fill="none">
|
|
7
|
+
<path d="M42 8L14 8L14 56L42 56L42 36L30 36" stroke="currentColor" stroke-width="2" stroke-linejoin="miter"/>
|
|
8
|
+
<line x1="42" y1="36" x2="50" y2="36" stroke="#00d4aa" stroke-width="2"/>
|
|
9
|
+
</svg>`;
|
|
10
|
+
var Logomark = ({ width = 64, height = 64, className }) => react.createElement(
|
|
11
|
+
"svg",
|
|
12
|
+
{
|
|
13
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
14
|
+
viewBox: "0 0 64 64",
|
|
15
|
+
fill: "none",
|
|
16
|
+
width,
|
|
17
|
+
height,
|
|
18
|
+
className,
|
|
19
|
+
role: "img",
|
|
20
|
+
"aria-label": "Glyph JS logomark"
|
|
21
|
+
},
|
|
22
|
+
react.createElement("path", {
|
|
23
|
+
d: "M42 8L14 8L14 56L42 56L42 36L30 36",
|
|
24
|
+
stroke: "currentColor",
|
|
25
|
+
strokeWidth: 2,
|
|
26
|
+
strokeLinejoin: "miter"
|
|
27
|
+
}),
|
|
28
|
+
react.createElement("line", {
|
|
29
|
+
x1: 42,
|
|
30
|
+
y1: 36,
|
|
31
|
+
x2: 50,
|
|
32
|
+
y2: 36,
|
|
33
|
+
stroke: "#00d4aa",
|
|
34
|
+
strokeWidth: 2
|
|
35
|
+
})
|
|
36
|
+
);
|
|
37
|
+
var wordmarkSvg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 40" fill="none">
|
|
38
|
+
<text x="0" y="28" font-family="Inter, Helvetica Neue, system-ui, sans-serif" font-size="24" font-weight="300" letter-spacing="0.08em" fill="currentColor">glyphjs</text>
|
|
39
|
+
</svg>`;
|
|
40
|
+
var Wordmark = ({ width = 200, height = 40, className }) => react.createElement(
|
|
41
|
+
"svg",
|
|
42
|
+
{
|
|
43
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
44
|
+
viewBox: "0 0 200 40",
|
|
45
|
+
fill: "none",
|
|
46
|
+
width,
|
|
47
|
+
height,
|
|
48
|
+
className,
|
|
49
|
+
role: "img",
|
|
50
|
+
"aria-label": "Glyph JS"
|
|
51
|
+
},
|
|
52
|
+
react.createElement(
|
|
53
|
+
"text",
|
|
54
|
+
{
|
|
55
|
+
x: 0,
|
|
56
|
+
y: 28,
|
|
57
|
+
fontFamily: "Inter, Helvetica Neue, system-ui, sans-serif",
|
|
58
|
+
fontSize: 24,
|
|
59
|
+
fontWeight: 300,
|
|
60
|
+
letterSpacing: "0.08em",
|
|
61
|
+
fill: "currentColor"
|
|
62
|
+
},
|
|
63
|
+
"glyphjs"
|
|
64
|
+
)
|
|
65
|
+
);
|
|
66
|
+
var comboSvg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 280 64" fill="none">
|
|
67
|
+
<g>
|
|
68
|
+
<path d="M42 8L14 8L14 56L42 56L42 36L30 36" stroke="currentColor" stroke-width="2" stroke-linejoin="miter"/>
|
|
69
|
+
<line x1="42" y1="36" x2="50" y2="36" stroke="#00d4aa" stroke-width="2"/>
|
|
70
|
+
</g>
|
|
71
|
+
<text x="76" y="40" font-family="Inter, Helvetica Neue, system-ui, sans-serif" font-size="24" font-weight="300" letter-spacing="0.08em" fill="currentColor">glyphjs</text>
|
|
72
|
+
</svg>`;
|
|
73
|
+
var ComboLogo = ({ width = 280, height = 64, className }) => react.createElement(
|
|
74
|
+
"svg",
|
|
75
|
+
{
|
|
76
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
77
|
+
viewBox: "0 0 280 64",
|
|
78
|
+
fill: "none",
|
|
79
|
+
width,
|
|
80
|
+
height,
|
|
81
|
+
className,
|
|
82
|
+
role: "img",
|
|
83
|
+
"aria-label": "Glyph JS"
|
|
84
|
+
},
|
|
85
|
+
react.createElement(
|
|
86
|
+
"g",
|
|
87
|
+
null,
|
|
88
|
+
react.createElement("path", {
|
|
89
|
+
d: "M42 8L14 8L14 56L42 56L42 36L30 36",
|
|
90
|
+
stroke: "currentColor",
|
|
91
|
+
strokeWidth: 2,
|
|
92
|
+
strokeLinejoin: "miter"
|
|
93
|
+
}),
|
|
94
|
+
react.createElement("line", {
|
|
95
|
+
x1: 42,
|
|
96
|
+
y1: 36,
|
|
97
|
+
x2: 50,
|
|
98
|
+
y2: 36,
|
|
99
|
+
stroke: "#00d4aa",
|
|
100
|
+
strokeWidth: 2
|
|
101
|
+
})
|
|
102
|
+
),
|
|
103
|
+
react.createElement(
|
|
104
|
+
"text",
|
|
105
|
+
{
|
|
106
|
+
x: 76,
|
|
107
|
+
y: 40,
|
|
108
|
+
fontFamily: "Inter, Helvetica Neue, system-ui, sans-serif",
|
|
109
|
+
fontSize: 24,
|
|
110
|
+
fontWeight: 300,
|
|
111
|
+
letterSpacing: "0.08em",
|
|
112
|
+
fill: "currentColor"
|
|
113
|
+
},
|
|
114
|
+
"glyphjs"
|
|
115
|
+
)
|
|
116
|
+
);
|
|
117
|
+
|
|
118
|
+
// src/themes/palette.ts
|
|
119
|
+
var palette = {
|
|
120
|
+
white: "#f4f6fa",
|
|
121
|
+
black: "#0a0e1a",
|
|
122
|
+
gray50: "#e8ecf3",
|
|
123
|
+
gray100: "#d0d8e4",
|
|
124
|
+
gray200: "#a8b5c8",
|
|
125
|
+
gray300: "#6b7a94",
|
|
126
|
+
gray700: "#2a3550",
|
|
127
|
+
gray800: "#1a2035",
|
|
128
|
+
gray900: "#0f1526",
|
|
129
|
+
cyan: "#00d4aa",
|
|
130
|
+
cyanLight: "#33e0be",
|
|
131
|
+
cyanLighter: "#66ebd2",
|
|
132
|
+
cyanDark: "#0a9d7c",
|
|
133
|
+
amber: "#00d4aa",
|
|
134
|
+
accent: "#00d4aa",
|
|
135
|
+
accentHover: "#088a6c",
|
|
136
|
+
accentHoverDark: "#33e0be",
|
|
137
|
+
accentSubtle: "#e6f6f2",
|
|
138
|
+
accentSubtleDark: "#0a1a1a",
|
|
139
|
+
accentMuted: "#b0ddd0",
|
|
140
|
+
accentMutedDark: "#1a4a3a",
|
|
141
|
+
red: "#f87171",
|
|
142
|
+
green: "#22c55e",
|
|
143
|
+
textDark: "#1a2035",
|
|
144
|
+
headingDark: "#0a0e1a",
|
|
145
|
+
textLight: "#d4dae3",
|
|
146
|
+
headingLight: "#edf0f5"
|
|
147
|
+
};
|
|
148
|
+
|
|
149
|
+
exports.ComboLogo = ComboLogo;
|
|
150
|
+
exports.Logomark = Logomark;
|
|
151
|
+
exports.Wordmark = Wordmark;
|
|
152
|
+
exports.comboSvg = comboSvg;
|
|
153
|
+
exports.logomarkSvg = logomarkSvg;
|
|
154
|
+
exports.palette = palette;
|
|
155
|
+
exports.wordmarkSvg = wordmarkSvg;
|
|
156
|
+
//# sourceMappingURL=index.cjs.map
|
|
157
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/logos/logomark.ts","../src/logos/wordmark.ts","../src/logos/combo.ts","../src/themes/palette.ts"],"names":["createElement"],"mappings":"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","file":"index.cjs","sourcesContent":["import type { FC } from 'react';\nimport { createElement } from 'react';\n\n/**\n * Stylized angular \"G\" logomark — geometric, constructed from straight\n * lines and precise angles. Cyan accent on the horizontal crossbar.\n */\nexport const logomarkSvg = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 64 64\" fill=\"none\">\n <path d=\"M42 8L14 8L14 56L42 56L42 36L30 36\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linejoin=\"miter\"/>\n <line x1=\"42\" y1=\"36\" x2=\"50\" y2=\"36\" stroke=\"#00d4aa\" stroke-width=\"2\"/>\n</svg>`;\n\ninterface LogoProps {\n width?: number | string;\n height?: number | string;\n className?: string;\n}\n\nexport const Logomark: FC<LogoProps> = ({ width = 64, height = 64, className }) =>\n createElement(\n 'svg',\n {\n xmlns: 'http://www.w3.org/2000/svg',\n viewBox: '0 0 64 64',\n fill: 'none',\n width,\n height,\n className,\n role: 'img',\n 'aria-label': 'Glyph JS logomark',\n },\n createElement('path', {\n d: 'M42 8L14 8L14 56L42 56L42 36L30 36',\n stroke: 'currentColor',\n strokeWidth: 2,\n strokeLinejoin: 'miter',\n }),\n createElement('line', {\n x1: 42,\n y1: 36,\n x2: 50,\n y2: 36,\n stroke: '#00d4aa',\n strokeWidth: 2,\n }),\n );\n","import type { FC } from 'react';\nimport { createElement } from 'react';\n\n/**\n * \"glyphjs\" wordmark — clean geometric sans-serif, all-lowercase,\n * letterspaced. Rendered as an SVG text element for scalability.\n */\nexport const wordmarkSvg = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 200 40\" fill=\"none\">\n <text x=\"0\" y=\"28\" font-family=\"Inter, Helvetica Neue, system-ui, sans-serif\" font-size=\"24\" font-weight=\"300\" letter-spacing=\"0.08em\" fill=\"currentColor\">glyphjs</text>\n</svg>`;\n\ninterface LogoProps {\n width?: number | string;\n height?: number | string;\n className?: string;\n}\n\nexport const Wordmark: FC<LogoProps> = ({ width = 200, height = 40, className }) =>\n createElement(\n 'svg',\n {\n xmlns: 'http://www.w3.org/2000/svg',\n viewBox: '0 0 200 40',\n fill: 'none',\n width,\n height,\n className,\n role: 'img',\n 'aria-label': 'Glyph JS',\n },\n createElement(\n 'text',\n {\n x: 0,\n y: 28,\n fontFamily: 'Inter, Helvetica Neue, system-ui, sans-serif',\n fontSize: 24,\n fontWeight: 300,\n letterSpacing: '0.08em',\n fill: 'currentColor',\n },\n 'glyphjs',\n ),\n );\n","import type { FC } from 'react';\nimport { createElement } from 'react';\n\n/**\n * Combined lockup — logomark left, wordmark right, with fixed\n * 12px clear-space gap between them.\n */\nexport const comboSvg = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 280 64\" fill=\"none\">\n <g>\n <path d=\"M42 8L14 8L14 56L42 56L42 36L30 36\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linejoin=\"miter\"/>\n <line x1=\"42\" y1=\"36\" x2=\"50\" y2=\"36\" stroke=\"#00d4aa\" stroke-width=\"2\"/>\n </g>\n <text x=\"76\" y=\"40\" font-family=\"Inter, Helvetica Neue, system-ui, sans-serif\" font-size=\"24\" font-weight=\"300\" letter-spacing=\"0.08em\" fill=\"currentColor\">glyphjs</text>\n</svg>`;\n\ninterface LogoProps {\n width?: number | string;\n height?: number | string;\n className?: string;\n}\n\nexport const ComboLogo: FC<LogoProps> = ({ width = 280, height = 64, className }) =>\n createElement(\n 'svg',\n {\n xmlns: 'http://www.w3.org/2000/svg',\n viewBox: '0 0 280 64',\n fill: 'none',\n width,\n height,\n className,\n role: 'img',\n 'aria-label': 'Glyph JS',\n },\n createElement(\n 'g',\n null,\n createElement('path', {\n d: 'M42 8L14 8L14 56L42 56L42 36L30 36',\n stroke: 'currentColor',\n strokeWidth: 2,\n strokeLinejoin: 'miter',\n }),\n createElement('line', {\n x1: 42,\n y1: 36,\n x2: 50,\n y2: 36,\n stroke: '#00d4aa',\n strokeWidth: 2,\n }),\n ),\n createElement(\n 'text',\n {\n x: 76,\n y: 40,\n fontFamily: 'Inter, Helvetica Neue, system-ui, sans-serif',\n fontSize: 24,\n fontWeight: 300,\n letterSpacing: '0.08em',\n fill: 'currentColor',\n },\n 'glyphjs',\n ),\n );\n","export const palette = {\n white: '#f4f6fa',\n black: '#0a0e1a',\n gray50: '#e8ecf3',\n gray100: '#d0d8e4',\n gray200: '#a8b5c8',\n gray300: '#6b7a94',\n gray700: '#2a3550',\n gray800: '#1a2035',\n gray900: '#0f1526',\n cyan: '#00d4aa',\n cyanLight: '#33e0be',\n cyanLighter: '#66ebd2',\n cyanDark: '#0a9d7c',\n amber: '#00d4aa',\n accent: '#00d4aa',\n accentHover: '#088a6c',\n accentHoverDark: '#33e0be',\n accentSubtle: '#e6f6f2',\n accentSubtleDark: '#0a1a1a',\n accentMuted: '#b0ddd0',\n accentMutedDark: '#1a4a3a',\n red: '#f87171',\n green: '#22c55e',\n textDark: '#1a2035',\n headingDark: '#0a0e1a',\n textLight: '#d4dae3',\n headingLight: '#edf0f5',\n} as const;\n"]}
|
package/dist/index.d.cts
ADDED
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Stylized angular "G" logomark — geometric, constructed from straight
|
|
5
|
+
* lines and precise angles. Cyan accent on the horizontal crossbar.
|
|
6
|
+
*/
|
|
7
|
+
declare const logomarkSvg = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 64 64\" fill=\"none\">\n <path d=\"M42 8L14 8L14 56L42 56L42 36L30 36\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linejoin=\"miter\"/>\n <line x1=\"42\" y1=\"36\" x2=\"50\" y2=\"36\" stroke=\"#00d4aa\" stroke-width=\"2\"/>\n</svg>";
|
|
8
|
+
interface LogoProps$2 {
|
|
9
|
+
width?: number | string;
|
|
10
|
+
height?: number | string;
|
|
11
|
+
className?: string;
|
|
12
|
+
}
|
|
13
|
+
declare const Logomark: FC<LogoProps$2>;
|
|
14
|
+
|
|
15
|
+
/**
|
|
16
|
+
* "glyphjs" wordmark — clean geometric sans-serif, all-lowercase,
|
|
17
|
+
* letterspaced. Rendered as an SVG text element for scalability.
|
|
18
|
+
*/
|
|
19
|
+
declare const wordmarkSvg = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 200 40\" fill=\"none\">\n <text x=\"0\" y=\"28\" font-family=\"Inter, Helvetica Neue, system-ui, sans-serif\" font-size=\"24\" font-weight=\"300\" letter-spacing=\"0.08em\" fill=\"currentColor\">glyphjs</text>\n</svg>";
|
|
20
|
+
interface LogoProps$1 {
|
|
21
|
+
width?: number | string;
|
|
22
|
+
height?: number | string;
|
|
23
|
+
className?: string;
|
|
24
|
+
}
|
|
25
|
+
declare const Wordmark: FC<LogoProps$1>;
|
|
26
|
+
|
|
27
|
+
/**
|
|
28
|
+
* Combined lockup — logomark left, wordmark right, with fixed
|
|
29
|
+
* 12px clear-space gap between them.
|
|
30
|
+
*/
|
|
31
|
+
declare const comboSvg = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 280 64\" fill=\"none\">\n <g>\n <path d=\"M42 8L14 8L14 56L42 56L42 36L30 36\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linejoin=\"miter\"/>\n <line x1=\"42\" y1=\"36\" x2=\"50\" y2=\"36\" stroke=\"#00d4aa\" stroke-width=\"2\"/>\n </g>\n <text x=\"76\" y=\"40\" font-family=\"Inter, Helvetica Neue, system-ui, sans-serif\" font-size=\"24\" font-weight=\"300\" letter-spacing=\"0.08em\" fill=\"currentColor\">glyphjs</text>\n</svg>";
|
|
32
|
+
interface LogoProps {
|
|
33
|
+
width?: number | string;
|
|
34
|
+
height?: number | string;
|
|
35
|
+
className?: string;
|
|
36
|
+
}
|
|
37
|
+
declare const ComboLogo: FC<LogoProps>;
|
|
38
|
+
|
|
39
|
+
declare const palette: {
|
|
40
|
+
readonly white: "#f4f6fa";
|
|
41
|
+
readonly black: "#0a0e1a";
|
|
42
|
+
readonly gray50: "#e8ecf3";
|
|
43
|
+
readonly gray100: "#d0d8e4";
|
|
44
|
+
readonly gray200: "#a8b5c8";
|
|
45
|
+
readonly gray300: "#6b7a94";
|
|
46
|
+
readonly gray700: "#2a3550";
|
|
47
|
+
readonly gray800: "#1a2035";
|
|
48
|
+
readonly gray900: "#0f1526";
|
|
49
|
+
readonly cyan: "#00d4aa";
|
|
50
|
+
readonly cyanLight: "#33e0be";
|
|
51
|
+
readonly cyanLighter: "#66ebd2";
|
|
52
|
+
readonly cyanDark: "#0a9d7c";
|
|
53
|
+
readonly amber: "#00d4aa";
|
|
54
|
+
readonly accent: "#00d4aa";
|
|
55
|
+
readonly accentHover: "#088a6c";
|
|
56
|
+
readonly accentHoverDark: "#33e0be";
|
|
57
|
+
readonly accentSubtle: "#e6f6f2";
|
|
58
|
+
readonly accentSubtleDark: "#0a1a1a";
|
|
59
|
+
readonly accentMuted: "#b0ddd0";
|
|
60
|
+
readonly accentMutedDark: "#1a4a3a";
|
|
61
|
+
readonly red: "#f87171";
|
|
62
|
+
readonly green: "#22c55e";
|
|
63
|
+
readonly textDark: "#1a2035";
|
|
64
|
+
readonly headingDark: "#0a0e1a";
|
|
65
|
+
readonly textLight: "#d4dae3";
|
|
66
|
+
readonly headingLight: "#edf0f5";
|
|
67
|
+
};
|
|
68
|
+
|
|
69
|
+
export { ComboLogo, Logomark, Wordmark, comboSvg, logomarkSvg, palette, wordmarkSvg };
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Stylized angular "G" logomark — geometric, constructed from straight
|
|
5
|
+
* lines and precise angles. Cyan accent on the horizontal crossbar.
|
|
6
|
+
*/
|
|
7
|
+
declare const logomarkSvg = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 64 64\" fill=\"none\">\n <path d=\"M42 8L14 8L14 56L42 56L42 36L30 36\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linejoin=\"miter\"/>\n <line x1=\"42\" y1=\"36\" x2=\"50\" y2=\"36\" stroke=\"#00d4aa\" stroke-width=\"2\"/>\n</svg>";
|
|
8
|
+
interface LogoProps$2 {
|
|
9
|
+
width?: number | string;
|
|
10
|
+
height?: number | string;
|
|
11
|
+
className?: string;
|
|
12
|
+
}
|
|
13
|
+
declare const Logomark: FC<LogoProps$2>;
|
|
14
|
+
|
|
15
|
+
/**
|
|
16
|
+
* "glyphjs" wordmark — clean geometric sans-serif, all-lowercase,
|
|
17
|
+
* letterspaced. Rendered as an SVG text element for scalability.
|
|
18
|
+
*/
|
|
19
|
+
declare const wordmarkSvg = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 200 40\" fill=\"none\">\n <text x=\"0\" y=\"28\" font-family=\"Inter, Helvetica Neue, system-ui, sans-serif\" font-size=\"24\" font-weight=\"300\" letter-spacing=\"0.08em\" fill=\"currentColor\">glyphjs</text>\n</svg>";
|
|
20
|
+
interface LogoProps$1 {
|
|
21
|
+
width?: number | string;
|
|
22
|
+
height?: number | string;
|
|
23
|
+
className?: string;
|
|
24
|
+
}
|
|
25
|
+
declare const Wordmark: FC<LogoProps$1>;
|
|
26
|
+
|
|
27
|
+
/**
|
|
28
|
+
* Combined lockup — logomark left, wordmark right, with fixed
|
|
29
|
+
* 12px clear-space gap between them.
|
|
30
|
+
*/
|
|
31
|
+
declare const comboSvg = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 280 64\" fill=\"none\">\n <g>\n <path d=\"M42 8L14 8L14 56L42 56L42 36L30 36\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linejoin=\"miter\"/>\n <line x1=\"42\" y1=\"36\" x2=\"50\" y2=\"36\" stroke=\"#00d4aa\" stroke-width=\"2\"/>\n </g>\n <text x=\"76\" y=\"40\" font-family=\"Inter, Helvetica Neue, system-ui, sans-serif\" font-size=\"24\" font-weight=\"300\" letter-spacing=\"0.08em\" fill=\"currentColor\">glyphjs</text>\n</svg>";
|
|
32
|
+
interface LogoProps {
|
|
33
|
+
width?: number | string;
|
|
34
|
+
height?: number | string;
|
|
35
|
+
className?: string;
|
|
36
|
+
}
|
|
37
|
+
declare const ComboLogo: FC<LogoProps>;
|
|
38
|
+
|
|
39
|
+
declare const palette: {
|
|
40
|
+
readonly white: "#f4f6fa";
|
|
41
|
+
readonly black: "#0a0e1a";
|
|
42
|
+
readonly gray50: "#e8ecf3";
|
|
43
|
+
readonly gray100: "#d0d8e4";
|
|
44
|
+
readonly gray200: "#a8b5c8";
|
|
45
|
+
readonly gray300: "#6b7a94";
|
|
46
|
+
readonly gray700: "#2a3550";
|
|
47
|
+
readonly gray800: "#1a2035";
|
|
48
|
+
readonly gray900: "#0f1526";
|
|
49
|
+
readonly cyan: "#00d4aa";
|
|
50
|
+
readonly cyanLight: "#33e0be";
|
|
51
|
+
readonly cyanLighter: "#66ebd2";
|
|
52
|
+
readonly cyanDark: "#0a9d7c";
|
|
53
|
+
readonly amber: "#00d4aa";
|
|
54
|
+
readonly accent: "#00d4aa";
|
|
55
|
+
readonly accentHover: "#088a6c";
|
|
56
|
+
readonly accentHoverDark: "#33e0be";
|
|
57
|
+
readonly accentSubtle: "#e6f6f2";
|
|
58
|
+
readonly accentSubtleDark: "#0a1a1a";
|
|
59
|
+
readonly accentMuted: "#b0ddd0";
|
|
60
|
+
readonly accentMutedDark: "#1a4a3a";
|
|
61
|
+
readonly red: "#f87171";
|
|
62
|
+
readonly green: "#22c55e";
|
|
63
|
+
readonly textDark: "#1a2035";
|
|
64
|
+
readonly headingDark: "#0a0e1a";
|
|
65
|
+
readonly textLight: "#d4dae3";
|
|
66
|
+
readonly headingLight: "#edf0f5";
|
|
67
|
+
};
|
|
68
|
+
|
|
69
|
+
export { ComboLogo, Logomark, Wordmark, comboSvg, logomarkSvg, palette, wordmarkSvg };
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,149 @@
|
|
|
1
|
+
import { createElement } from 'react';
|
|
2
|
+
|
|
3
|
+
// src/logos/logomark.ts
|
|
4
|
+
var logomarkSvg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" fill="none">
|
|
5
|
+
<path d="M42 8L14 8L14 56L42 56L42 36L30 36" stroke="currentColor" stroke-width="2" stroke-linejoin="miter"/>
|
|
6
|
+
<line x1="42" y1="36" x2="50" y2="36" stroke="#00d4aa" stroke-width="2"/>
|
|
7
|
+
</svg>`;
|
|
8
|
+
var Logomark = ({ width = 64, height = 64, className }) => createElement(
|
|
9
|
+
"svg",
|
|
10
|
+
{
|
|
11
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
12
|
+
viewBox: "0 0 64 64",
|
|
13
|
+
fill: "none",
|
|
14
|
+
width,
|
|
15
|
+
height,
|
|
16
|
+
className,
|
|
17
|
+
role: "img",
|
|
18
|
+
"aria-label": "Glyph JS logomark"
|
|
19
|
+
},
|
|
20
|
+
createElement("path", {
|
|
21
|
+
d: "M42 8L14 8L14 56L42 56L42 36L30 36",
|
|
22
|
+
stroke: "currentColor",
|
|
23
|
+
strokeWidth: 2,
|
|
24
|
+
strokeLinejoin: "miter"
|
|
25
|
+
}),
|
|
26
|
+
createElement("line", {
|
|
27
|
+
x1: 42,
|
|
28
|
+
y1: 36,
|
|
29
|
+
x2: 50,
|
|
30
|
+
y2: 36,
|
|
31
|
+
stroke: "#00d4aa",
|
|
32
|
+
strokeWidth: 2
|
|
33
|
+
})
|
|
34
|
+
);
|
|
35
|
+
var wordmarkSvg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 40" fill="none">
|
|
36
|
+
<text x="0" y="28" font-family="Inter, Helvetica Neue, system-ui, sans-serif" font-size="24" font-weight="300" letter-spacing="0.08em" fill="currentColor">glyphjs</text>
|
|
37
|
+
</svg>`;
|
|
38
|
+
var Wordmark = ({ width = 200, height = 40, className }) => createElement(
|
|
39
|
+
"svg",
|
|
40
|
+
{
|
|
41
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
42
|
+
viewBox: "0 0 200 40",
|
|
43
|
+
fill: "none",
|
|
44
|
+
width,
|
|
45
|
+
height,
|
|
46
|
+
className,
|
|
47
|
+
role: "img",
|
|
48
|
+
"aria-label": "Glyph JS"
|
|
49
|
+
},
|
|
50
|
+
createElement(
|
|
51
|
+
"text",
|
|
52
|
+
{
|
|
53
|
+
x: 0,
|
|
54
|
+
y: 28,
|
|
55
|
+
fontFamily: "Inter, Helvetica Neue, system-ui, sans-serif",
|
|
56
|
+
fontSize: 24,
|
|
57
|
+
fontWeight: 300,
|
|
58
|
+
letterSpacing: "0.08em",
|
|
59
|
+
fill: "currentColor"
|
|
60
|
+
},
|
|
61
|
+
"glyphjs"
|
|
62
|
+
)
|
|
63
|
+
);
|
|
64
|
+
var comboSvg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 280 64" fill="none">
|
|
65
|
+
<g>
|
|
66
|
+
<path d="M42 8L14 8L14 56L42 56L42 36L30 36" stroke="currentColor" stroke-width="2" stroke-linejoin="miter"/>
|
|
67
|
+
<line x1="42" y1="36" x2="50" y2="36" stroke="#00d4aa" stroke-width="2"/>
|
|
68
|
+
</g>
|
|
69
|
+
<text x="76" y="40" font-family="Inter, Helvetica Neue, system-ui, sans-serif" font-size="24" font-weight="300" letter-spacing="0.08em" fill="currentColor">glyphjs</text>
|
|
70
|
+
</svg>`;
|
|
71
|
+
var ComboLogo = ({ width = 280, height = 64, className }) => createElement(
|
|
72
|
+
"svg",
|
|
73
|
+
{
|
|
74
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
75
|
+
viewBox: "0 0 280 64",
|
|
76
|
+
fill: "none",
|
|
77
|
+
width,
|
|
78
|
+
height,
|
|
79
|
+
className,
|
|
80
|
+
role: "img",
|
|
81
|
+
"aria-label": "Glyph JS"
|
|
82
|
+
},
|
|
83
|
+
createElement(
|
|
84
|
+
"g",
|
|
85
|
+
null,
|
|
86
|
+
createElement("path", {
|
|
87
|
+
d: "M42 8L14 8L14 56L42 56L42 36L30 36",
|
|
88
|
+
stroke: "currentColor",
|
|
89
|
+
strokeWidth: 2,
|
|
90
|
+
strokeLinejoin: "miter"
|
|
91
|
+
}),
|
|
92
|
+
createElement("line", {
|
|
93
|
+
x1: 42,
|
|
94
|
+
y1: 36,
|
|
95
|
+
x2: 50,
|
|
96
|
+
y2: 36,
|
|
97
|
+
stroke: "#00d4aa",
|
|
98
|
+
strokeWidth: 2
|
|
99
|
+
})
|
|
100
|
+
),
|
|
101
|
+
createElement(
|
|
102
|
+
"text",
|
|
103
|
+
{
|
|
104
|
+
x: 76,
|
|
105
|
+
y: 40,
|
|
106
|
+
fontFamily: "Inter, Helvetica Neue, system-ui, sans-serif",
|
|
107
|
+
fontSize: 24,
|
|
108
|
+
fontWeight: 300,
|
|
109
|
+
letterSpacing: "0.08em",
|
|
110
|
+
fill: "currentColor"
|
|
111
|
+
},
|
|
112
|
+
"glyphjs"
|
|
113
|
+
)
|
|
114
|
+
);
|
|
115
|
+
|
|
116
|
+
// src/themes/palette.ts
|
|
117
|
+
var palette = {
|
|
118
|
+
white: "#f4f6fa",
|
|
119
|
+
black: "#0a0e1a",
|
|
120
|
+
gray50: "#e8ecf3",
|
|
121
|
+
gray100: "#d0d8e4",
|
|
122
|
+
gray200: "#a8b5c8",
|
|
123
|
+
gray300: "#6b7a94",
|
|
124
|
+
gray700: "#2a3550",
|
|
125
|
+
gray800: "#1a2035",
|
|
126
|
+
gray900: "#0f1526",
|
|
127
|
+
cyan: "#00d4aa",
|
|
128
|
+
cyanLight: "#33e0be",
|
|
129
|
+
cyanLighter: "#66ebd2",
|
|
130
|
+
cyanDark: "#0a9d7c",
|
|
131
|
+
amber: "#00d4aa",
|
|
132
|
+
accent: "#00d4aa",
|
|
133
|
+
accentHover: "#088a6c",
|
|
134
|
+
accentHoverDark: "#33e0be",
|
|
135
|
+
accentSubtle: "#e6f6f2",
|
|
136
|
+
accentSubtleDark: "#0a1a1a",
|
|
137
|
+
accentMuted: "#b0ddd0",
|
|
138
|
+
accentMutedDark: "#1a4a3a",
|
|
139
|
+
red: "#f87171",
|
|
140
|
+
green: "#22c55e",
|
|
141
|
+
textDark: "#1a2035",
|
|
142
|
+
headingDark: "#0a0e1a",
|
|
143
|
+
textLight: "#d4dae3",
|
|
144
|
+
headingLight: "#edf0f5"
|
|
145
|
+
};
|
|
146
|
+
|
|
147
|
+
export { ComboLogo, Logomark, Wordmark, comboSvg, logomarkSvg, palette, wordmarkSvg };
|
|
148
|
+
//# sourceMappingURL=index.js.map
|
|
149
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/logos/logomark.ts","../src/logos/wordmark.ts","../src/logos/combo.ts","../src/themes/palette.ts"],"names":["createElement"],"mappings":"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","file":"index.js","sourcesContent":["import type { FC } from 'react';\nimport { createElement } from 'react';\n\n/**\n * Stylized angular \"G\" logomark — geometric, constructed from straight\n * lines and precise angles. Cyan accent on the horizontal crossbar.\n */\nexport const logomarkSvg = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 64 64\" fill=\"none\">\n <path d=\"M42 8L14 8L14 56L42 56L42 36L30 36\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linejoin=\"miter\"/>\n <line x1=\"42\" y1=\"36\" x2=\"50\" y2=\"36\" stroke=\"#00d4aa\" stroke-width=\"2\"/>\n</svg>`;\n\ninterface LogoProps {\n width?: number | string;\n height?: number | string;\n className?: string;\n}\n\nexport const Logomark: FC<LogoProps> = ({ width = 64, height = 64, className }) =>\n createElement(\n 'svg',\n {\n xmlns: 'http://www.w3.org/2000/svg',\n viewBox: '0 0 64 64',\n fill: 'none',\n width,\n height,\n className,\n role: 'img',\n 'aria-label': 'Glyph JS logomark',\n },\n createElement('path', {\n d: 'M42 8L14 8L14 56L42 56L42 36L30 36',\n stroke: 'currentColor',\n strokeWidth: 2,\n strokeLinejoin: 'miter',\n }),\n createElement('line', {\n x1: 42,\n y1: 36,\n x2: 50,\n y2: 36,\n stroke: '#00d4aa',\n strokeWidth: 2,\n }),\n );\n","import type { FC } from 'react';\nimport { createElement } from 'react';\n\n/**\n * \"glyphjs\" wordmark — clean geometric sans-serif, all-lowercase,\n * letterspaced. Rendered as an SVG text element for scalability.\n */\nexport const wordmarkSvg = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 200 40\" fill=\"none\">\n <text x=\"0\" y=\"28\" font-family=\"Inter, Helvetica Neue, system-ui, sans-serif\" font-size=\"24\" font-weight=\"300\" letter-spacing=\"0.08em\" fill=\"currentColor\">glyphjs</text>\n</svg>`;\n\ninterface LogoProps {\n width?: number | string;\n height?: number | string;\n className?: string;\n}\n\nexport const Wordmark: FC<LogoProps> = ({ width = 200, height = 40, className }) =>\n createElement(\n 'svg',\n {\n xmlns: 'http://www.w3.org/2000/svg',\n viewBox: '0 0 200 40',\n fill: 'none',\n width,\n height,\n className,\n role: 'img',\n 'aria-label': 'Glyph JS',\n },\n createElement(\n 'text',\n {\n x: 0,\n y: 28,\n fontFamily: 'Inter, Helvetica Neue, system-ui, sans-serif',\n fontSize: 24,\n fontWeight: 300,\n letterSpacing: '0.08em',\n fill: 'currentColor',\n },\n 'glyphjs',\n ),\n );\n","import type { FC } from 'react';\nimport { createElement } from 'react';\n\n/**\n * Combined lockup — logomark left, wordmark right, with fixed\n * 12px clear-space gap between them.\n */\nexport const comboSvg = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 280 64\" fill=\"none\">\n <g>\n <path d=\"M42 8L14 8L14 56L42 56L42 36L30 36\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linejoin=\"miter\"/>\n <line x1=\"42\" y1=\"36\" x2=\"50\" y2=\"36\" stroke=\"#00d4aa\" stroke-width=\"2\"/>\n </g>\n <text x=\"76\" y=\"40\" font-family=\"Inter, Helvetica Neue, system-ui, sans-serif\" font-size=\"24\" font-weight=\"300\" letter-spacing=\"0.08em\" fill=\"currentColor\">glyphjs</text>\n</svg>`;\n\ninterface LogoProps {\n width?: number | string;\n height?: number | string;\n className?: string;\n}\n\nexport const ComboLogo: FC<LogoProps> = ({ width = 280, height = 64, className }) =>\n createElement(\n 'svg',\n {\n xmlns: 'http://www.w3.org/2000/svg',\n viewBox: '0 0 280 64',\n fill: 'none',\n width,\n height,\n className,\n role: 'img',\n 'aria-label': 'Glyph JS',\n },\n createElement(\n 'g',\n null,\n createElement('path', {\n d: 'M42 8L14 8L14 56L42 56L42 36L30 36',\n stroke: 'currentColor',\n strokeWidth: 2,\n strokeLinejoin: 'miter',\n }),\n createElement('line', {\n x1: 42,\n y1: 36,\n x2: 50,\n y2: 36,\n stroke: '#00d4aa',\n strokeWidth: 2,\n }),\n ),\n createElement(\n 'text',\n {\n x: 76,\n y: 40,\n fontFamily: 'Inter, Helvetica Neue, system-ui, sans-serif',\n fontSize: 24,\n fontWeight: 300,\n letterSpacing: '0.08em',\n fill: 'currentColor',\n },\n 'glyphjs',\n ),\n );\n","export const palette = {\n white: '#f4f6fa',\n black: '#0a0e1a',\n gray50: '#e8ecf3',\n gray100: '#d0d8e4',\n gray200: '#a8b5c8',\n gray300: '#6b7a94',\n gray700: '#2a3550',\n gray800: '#1a2035',\n gray900: '#0f1526',\n cyan: '#00d4aa',\n cyanLight: '#33e0be',\n cyanLighter: '#66ebd2',\n cyanDark: '#0a9d7c',\n amber: '#00d4aa',\n accent: '#00d4aa',\n accentHover: '#088a6c',\n accentHoverDark: '#33e0be',\n accentSubtle: '#e6f6f2',\n accentSubtleDark: '#0a1a1a',\n accentMuted: '#b0ddd0',\n accentMutedDark: '#1a4a3a',\n red: '#f87171',\n green: '#22c55e',\n textDark: '#1a2035',\n headingDark: '#0a0e1a',\n textLight: '#d4dae3',\n headingLight: '#edf0f5',\n} as const;\n"]}
|
package/package.json
ADDED
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@glyphjs/brand",
|
|
3
|
+
"version": "0.1.0",
|
|
4
|
+
"description": "Brand assets for Glyph JS — SVG logos and palette constants",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"main": "./dist/index.cjs",
|
|
7
|
+
"module": "./dist/index.js",
|
|
8
|
+
"types": "./dist/index.d.ts",
|
|
9
|
+
"exports": {
|
|
10
|
+
".": {
|
|
11
|
+
"import": {
|
|
12
|
+
"types": "./dist/index.d.ts",
|
|
13
|
+
"default": "./dist/index.js"
|
|
14
|
+
},
|
|
15
|
+
"require": {
|
|
16
|
+
"types": "./dist/index.d.cts",
|
|
17
|
+
"default": "./dist/index.cjs"
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
},
|
|
21
|
+
"files": [
|
|
22
|
+
"dist",
|
|
23
|
+
"LICENSE"
|
|
24
|
+
],
|
|
25
|
+
"peerDependencies": {
|
|
26
|
+
"react": "^18.0.0 || ^19.0.0"
|
|
27
|
+
},
|
|
28
|
+
"sideEffects": false,
|
|
29
|
+
"license": "MIT",
|
|
30
|
+
"author": "Vledic Franco",
|
|
31
|
+
"repository": {
|
|
32
|
+
"type": "git",
|
|
33
|
+
"url": "https://github.com/VledicFranco/glyphjs.git",
|
|
34
|
+
"directory": "packages/brand"
|
|
35
|
+
},
|
|
36
|
+
"homepage": "https://github.com/VledicFranco/glyphjs#readme",
|
|
37
|
+
"bugs": "https://github.com/VledicFranco/glyphjs/issues",
|
|
38
|
+
"keywords": [
|
|
39
|
+
"glyph",
|
|
40
|
+
"glyphjs",
|
|
41
|
+
"brand",
|
|
42
|
+
"logo",
|
|
43
|
+
"svg",
|
|
44
|
+
"design"
|
|
45
|
+
],
|
|
46
|
+
"devDependencies": {
|
|
47
|
+
"@types/react": "^19.2.10"
|
|
48
|
+
},
|
|
49
|
+
"scripts": {
|
|
50
|
+
"build": "tsup",
|
|
51
|
+
"typecheck": "tsc --noEmit",
|
|
52
|
+
"lint": "eslint src/",
|
|
53
|
+
"clean": "rm -rf dist .turbo"
|
|
54
|
+
}
|
|
55
|
+
}
|